下载带有 filesaver.js 和 blob 的 pdf答案

【问题标题】：download a pdf with filesaver.js and blob下载带有 filesaver.js 和 blob 的 pdf
【发布时间】：2018-05-09 05:24:48
【问题描述】：

我正在尝试使用Filesaver.js 下载文件。当我尝试使用 csv 执行此操作时，它工作正常。但我现在需要下载一个 pdf。

我该怎么做？我将 Filesaver.js 与 blob 对象一起使用，我的代码如下所示：

var filename = "myfile.csv";
var s = "my csv text content";
var blob = new Blob([s], {type "text/csv;charset=utf-8"});
var filesaver = saveAs(blob,filename);

当我想下载 pdf 时，我想知道应该将哪种数据类型传递给 blob 对象。

【问题讨论】：

标签： javascript filesaver.js

【解决方案1】：

 var blob = new Blob([response.data], {type: "application/pdf;charset=utf-8"});
 var blob = new Blob([response.data], {type: "text/plain;charset=utf-8"});

两者都可以，但标题应该是

{responseType:"arraybuffer"}

【讨论】：

谢谢这对我有用，.. 但是如何获取文件名？

【解决方案2】：

数据类型当然应该是application/pdf。

内容应该在base64，所以blob应该以

开头

data:application/pdf;base64,

正如您在jspdf 库源代码中看到的那样。

享受demo。

【讨论】：

提供的样本未按要求使用 FileSaver。
确实如此，在 Chrome 版本 71.0.3578.98（官方构建）（64 位）上验证

【解决方案3】：

PDF 完全是另一种格式，FileSaver 的唯一任务是保存文件。

您可以使用jsPDF 库来执行此操作。这就是您可以在您的情况下使用它的方式：

var filename = "myfile.csv";
var s = "my csv text content";

var pdf = new jsPDF();
pdf.text(10, 10, s);
pdf.save(filename.replace(".csv", ".pdf"));

【讨论】：