How to display javascript File object in Chrome PDF viewer application with its name?

Question

I have a PDF file as a Blob object (generated using jsPDF ) that I want to display in the <iframe> element.

I can do this easily as follows:

 iframe.src = URL.createObjectURL( blob ) 

PDF is processed correctly, but instead of its name I get an esoteric string (see the image below in the Chrome PDF viewer application).

So, I tried to convert the Blob to a File object to give it a human-readable name.

 var file = new File( [blob], 'a_name.pdf', { type: 'application/pdf' } ) iframe.src = URL.createObjectURL( file ) 

It works with Firefox: the name is saved when the file is saved from the PDF view header. Unfortunately, it is deleted in Chrome and replaced with an arbitrary file name before downloading to the PDF viewer.

Do you know if it is possible to display a PDF file object in an <iframe> with its name?

Answer 1

You can set the PDF header generated by jsPDF using the setProperties method:

 var doc = new jsPDF(); doc.setProperties({ title: "This is my title" }); ... 

This title will appear in the PDF viewer in Chrome. You can test it on the Live Demo page.