download a pdf with filesaver.js and blob

Question

I'm trying to download a file with Filesaver.js. And when I try to do this with csv, it works fine. But I need to download a pdf now.

How can I do that? I use Filesaver.js with a blob object, my code looks something like this:

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

I'd like to know what kind of data type should I pass to the blob onject, when I'd like to download the pdf.

score 4 · Answer 1 · answered Mar 24 '17 at 07:11

4

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

Both are ok,but header should be

{responseType:"arraybuffer"}

answered Mar 24 '17 at 07:11

Ado

411
4
9

1

thanks this is works for me,.. but how to get the filename? – AbingPj Jul 08 '20 at 14:33

score 2 · Answer 2 · answered Feb 18 '16 at 23:25

2

Data type should be application/pdf of course.

The content should be on base64 so the blob should start with

data:application/pdf;base64,

As you can see in the jspdf library source code.

Enjoy the demo.

answered Feb 18 '16 at 23:25

Ruslan López

4,433
2
26
37

2

Provided sample doesn't use FileSaver as requested. – ronnyfm May 22 '17 at 20:37
It does, verified on Chrome Version 71.0.3578.98 (Official Build) (64-bit) – Ruslan López Jan 18 '19 at 21:07

score 1 · Answer 3 · answered Feb 19 '16 at 00:11

PDF is completely another format and FileSaver's only mission is saving files.

You can use jsPDF library to do that. This is how you could use it in your case:

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

download a pdf with filesaver.js and blob

3 Answers3

Linked