javascript - 使用 javascript 下载时 PDF 为空白

Question

我有一个网络服务在其响应中返回 PDF 文件内容。当用户单击链接时，我想将其下载为 pdf 文件。我在UI中编写的javascript代码如下:

$http.get('http://MyPdfFileAPIstreamURl').then(function(response){
var blob=new File([response],'myBill.pdf',{type: "text/pdf"});
var link=document.createElement('a');
link.href=window.URL.createObjectURL(blob);
link.download="myBill.pdf";
link.click();
});

'response' 包含来自 'MyPdfFileAPIstreamURl' 的 servlet 输出流的 PDF 字节数组。而且流也没有加密。

因此，当我单击该链接时，成功下载了一个大小约为 200KB 的 PDF 文件。但是当我打开这个文件时，它会打开空白页。下载的pdf文件的起始内容在图片中。

我不明白这里出了什么问题。帮助!

这是下载的pdf文件起始内容:

Answer 1

通过 XMLHttpRequest 和 xhr.responseType = 'arraybuffer'; 解决了这个问题 代码:

var xhr = new XMLHttpRequest();
    xhr.open('GET', './api/exportdoc/report_'+id, true);
    xhr.responseType = 'arraybuffer';
    xhr.onload = function(e) {
       if (this.status == 200) {
          var blob=new Blob([this.response], {type:"application/pdf"});
          var link=document.createElement('a');
          link.href=window.URL.createObjectURL(blob);
          link.download="Report_"+new Date()+".pdf";
          link.click();
       }
    };
xhr.send();