使用FileSaver.js和Blob下载PDF文件

Question

我正在尝试使用Filesaver.js下载文件。当我尝试用csv格式下载时，它可以正常工作。但是现在我需要下载pdf文件。

我该如何做呢？ 我使用了一个blob对象和Filesaver.js，我的代码大致如下：

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对象呢？

- madca0313

Answer 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"});

两种方案都可以，但首选应该是 header。

{responseType:"arraybuffer"}

- Ado

---

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

Answer 2

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

内容应该是base64编码的，因此Blob应该以...开头。

data:application/pdf;base64,

您可以在jspdf库的源代码中看到。

欣赏演示。

- Ruslan López

---

提供的示例没有使用FileSaver，如您所要求。 - ronnyfm

它能够正常工作，在 Chrome Version 71.0.3578.98 (Official Build) (64-bit) 版本中经过验证。 - Ruslan López

Answer 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"));

- Przemek