javascript - Ajax 和下载 PDF

Question

我们有一种有趣的方法来使用内部自定义框架来执行 ajax，本质上是在我做的一些 javascript 函数中:

    CT.postSynch('report/index/downloadProjectsInProgress', {}, function(data){
    });

这告诉 ajax 寻找名为 Report 的模块、名为 Index 的 Controller 和名为 ajazDownloadProjectInprogress 的操作

我写了一个函数 ajazDownloadProjectInprogress，它所做的就是根据我取回的一些数据创建一个简单的 PDF。在该函数中，我有以下内容(使用 DOMPDF):

$dompdf = new DOMPDF();

$content = $this->raw('./report.header','./projectsInProgressReport','./report.footer');

$dompdf->load_html($content);
$dompdf->render();
$dompdf->output();
header('Pragma:');
header('Cache-Control: private,no-cache');
return $dompdf->stream("Structure Report - ProgressReports.pdf", array('Attachment' => 1));

我在这里所做的就是根据我们将 View 呈现为 html 或原始数据的方式抓取一些内容，并尝试通过 ajax 流回 pdf。

在上面的代码中，我向您展示了我们如何处理 ajax 调用，我做了:

    CT.postSynch('report/index/downloadProjectsInProgress', {}, function(data){
        return data;
    });

现在网络选项卡显示:

%PDF-1.3
1 0 obj
<< /Type /Catalog
/Outlines 2 0 R
/Pages 3 0 R >>
endobj
2 0 obj
<< /Type /Outlines /Count 0 >>
endobj
3 0 obj
<< /Type /Pages
/Kids [6 0 R
]
/Count 1
/Resources <<
/ProcSet 4 0 R
/Font << 
/F1 8 0 R
/F2 9 0 R
>>
/XObject << 
/I1 10 0 R
/I2 11 0 R

这只是返回内容的示例....如果我不是通过 ajax 执行此操作，而是直接调用此操作，则会下载包含我所需内容的实际 PDF。

有谁知道您应该如何通过 ajax 调用下载 PDF？我知道 ajax 它自己不会下载文件 - 但我设置了所有内容，以便该功能应该只开始下载过程。

Answer 1

使用 AJAX 下载 PDF 意味着，以最简单的形式，您必须逐位请求 PDF 的二进制数据。有关通过 AJAX 请求然后解析和显示 PDF 文件的二进制 block 的示例，请查看 Mozilla 的 PDF.js library。特别是他们的network code .

如果您只想从服务器请求 PDF 并将其下载或显示在浏览器中，您应该简单地获取相关 PDF 的 URL(可以是您的自定义 Controller 或其他东西)并设置window.location 到那个值。使用您示例中的大纲，它可以像这样简单:

window.location.href = 'report/index/downloadProjectsInProgress';

您需要确保服务器代码添加一个 Content-disposition: attachment; filename=file.pdf header ，这将强制 window.location 更改以下载文件而不是尝试显示它。 Here's a StackOverflow post that describes how to do exactly that.