使用jquery ajax下载pdf文件

我想为jquery ajax响应下载pdf文件。 Ajax响应包含pdf文件数据。 我试过这个解决方案 。 我的代码如下，但我总是得到一个空白的pdf。

$(document).on('click', '.download-ss-btn', function () { $.ajax({ type: "POST", url: 'http://127.0.0.1:8080/utils/json/pdfGen', data: { data: JSON.stringify(jsonData) } }).done(function (data) { var blob = new Blob([data]); var link = document.createElement('a'); link.href = window.URL.createObjectURL(blob); link.download = "Sample.pdf"; link.click(); }); }); 

Answer 1

jQuery使用AJAX请求加载二进制数据有一些问题，因为它还没有实现一些HTML5 XHR v2function，请参阅此增强请求和此讨论

鉴于此，您有两种解决方案之一：

第一个解决方案，放弃JQuery并使用XMLHTTPRequest

使用本机HTMLHTTPRequest，这是执行您需要的代码

  var req = new XMLHttpRequest(); req.open("GET", "/file.pdf", true); req.responseType = "blob"; req.onload = function (event) { var blob = req.response; console.log(blob.size); var link=document.createElement('a'); link.href=window.URL.createObjectURL(blob); link.download="Dossier_" + new Date() + ".pdf"; link.click(); }; req.send(); 

第二种解决方案，使用jquery-ajax-native插件

该插件可以在这里找到，可以用于JQuery中缺少的XHR V2function，下面是一个示例代码如何使用它

 $.ajax({ dataType: 'native', url: "/file.pdf", xhrFields: { responseType: 'blob' }, success: function(blob){ console.log(blob.size); var link=document.createElement('a'); link.href=window.URL.createObjectURL(blob); link.download="Dossier_" + new Date() + ".pdf"; link.click(); } }); 

Answer 2

我是新手，大部分代码来自谷歌搜索。 我的pdf下载使用下面的代码（试错法）。 感谢上面的代码提示（xhrFields）。

 $.ajax({ cache: false, type: 'POST', url: 'yourURL' contentType: false, processData: false, data: yourdata, //xhrFields is what did the trick to read the blob to pdf xhrFields: { responseType: 'blob' }, success: function (response, status, xhr) { var filename = ""; var disposition = xhr.getResponseHeader('Content-Disposition'); if (disposition) { var filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/; var matches = filenameRegex.exec(disposition); if (matches !== null && matches[1]) filename = matches[1].replace(/['"]/g, ''); } var linkelem = document.createElement('a'); try { var blob = new Blob([response], { type: 'application/octet-stream' }); if (typeof window.navigator.msSaveBlob !== 'undefined') { // IE workaround for "HTML7007: One or more blob URLs were revoked by closing the blob for which they were created. These URLs will no longer resolve as the data backing the URL has been freed." window.navigator.msSaveBlob(blob, filename); } else { var URL = window.URL || window.webkitURL; var downloadUrl = URL.createObjectURL(blob); if (filename) { // use HTML5 a[download] attribute to specify filename var a = document.createElement("a"); // safari doesn't support this yet if (typeof a.download === 'undefined') { window.location = downloadUrl; } else { a.href = downloadUrl; a.download = filename; document.body.appendChild(a); a.target = "_blank"; a.click(); } } else { window.location = downloadUrl; } } } catch (ex) { console.log(ex); } } });