使用AJAX调用显示PDF
我正在尝试通过AJAX调用显示PDF（在服务器端创建并作为Web流传递到客户端）。 我的代码如下：
jQuery.ajax({ type: "POST", processData: false, url: "aaaa.p?name=pdf", data: inputxml, contentType: "application/xml; charset=utf-8", success: function(data) { // here the data is the PDF stream i'm getting from the server side. } }); ‘inputxml’包含服务器的输入参数以创建PDF。 和包含PDF流的成功函数中的“数据”。 有没有办法在AJAX调用的成功函数内打开浏览器上的PDF文件而不进行任何页面提交？ 在服务器端，PDF也不是物理生成的。 非常感谢您的帮助……
为什么要通过AJAX加载它？ 为什么不在需要时生成的IFRAME中加载它。 标准的浏览器插件会在iframe中显示它。
$('#link').click(function(e) { e.preventDefault(); // if you have a URL in the link jQuery.ajax({ type: "POST", processData: false, url: "aaaa.p?name=pdf", data: inputxml, contentType: "application/xml; charset=utf-8", success: function(data) { var iframe = $('
这是我处理这个问题的方法。 它基于此pdfmake文件的第50行（ https://github.com/bpampuch/pdfmake/blob/master/src/browser-extensions/pdfMake.js ）。
-
假设你有一个pdf流我将它转换为base64并将其回送给我的AJAX：
$pdfString = $mpdf->Output('', 'S'); $pdfBase64 = base64_encode($pdfString); echo 'data:application/pdf;base64,' . $pdfBase64; -
这是我的AJAX代码。 接收数据时，它会打开一个新窗口并用base64端口数据替换url：
var ajaxRequest = $.ajax({ url: "php/generate-pdf/print-control.php", data: '', cache: false, contentType: 'application/json', processData: false, type: 'POST' }); $.when(ajaxRequest).done(function (ajaxValue) { var win = window.open('', '_blank'); win.location.href = ajaxValue; });这种方法的缺点是你在地址栏中得到一个base64字符串。
您可以生成临时URL以访问存储在服务器上的PDF文件，而不是将其发送回AJAX调用。 只需将生成的URL传递回客户端即可。 然后，当您收到URL时，您可以执行window.location =以将浏览器重定向到下载。
确保为生成的文件设置了正确的标题（ Content-Disposition: attachment等），并且一切都应该没问题。
编辑：虽然您可能只是使用常规（非JavaScript）链接来生成和下载文件。 但是通过AJAX执行此操作可以在生成文件时向用户显示一些特定的动画等。
对于任何偶然发现这一点的人。 这是一个使用axios的例子
- responseType必须是’arrayBuffer’
- 从响应中创建Blob对象
-
从blob中创建一个“对象URL”，您可以将其加载到iframe中
axios({ url: `path/to/pdf`, method: "GET", responseType: 'arraybuffer' }).then((response) => { let blob = new Blob([response.data], { type: response.headers['content-type'] } ); let url = window.URL.createObjectURL(blob); $('#frame').attr('src',url); });