Friday, November 24, 2017

How to serve blob and have good filename for all users?

By Hường Hana 4:30 PM , , Leave a Comment

I have a PDF file as a blob object. I want to serve to my users, and right now I'm doing:

html = '<iframe src="' + URL.createURL(blob) + '">';

That works fine for people that want to use their in-browser PDF tool.

But...some people have their browser set to automatically download PDFs. For those people, the name of the downloaded file is some random string based on the blob URL. That's a bad experience for them.

I know I can also do:

<a href="blobURL" download="some-filename.pdf">

But that's a bad experience for the people who want to use in-browser PDF readers, since it forces them to download the file.

Is there a way to make everybody have good file names and to allow everybody to read the PDF the way they want to (in their browser or in their OS's reader)?

Thanks

3 Answers

Answers 1

At least looking at Google Chrome, if the user disables the PDF Viewer (using the option "Download PDF files instead of automatically opening them in Chrome") then window.navigator.plugins will show neither "Chromium PDF Plugin" nor "Chromium PDF Viewer". If the option is left at the default setting, the viewer will show in the plugin list.

Using this method, one can utilize window.navigator.plugins to check if any of the elements' names are either of the aforementioned plugins. Then, depending upon that result, either display a <iframe> or a <a href="blobUrl" download="file.pdf">. For other browsers I imagine that different methods would have to be used. You can also check for a "Acrobat Reader" plugin, which some machines may have instead, or even just the word "PDF".

On a side note, it does look like it is possible to detect if the default Firefox PDF viewer is enabled by using http://www.pinlady.net/PluginDetect/PDFjs/ .

Answers 2

Try to append &filename=thename.pdf to the binary, metadata or http header:

Content-Disposition: attachment; filename="thename.pdf"

Answers 3

I have looked through the documentation of createObjectURL(blob), it will always return a unique and specific format of url. It is not possible to change the URL here.

The plugin thing is not consistent across browsers.

Now here is my radical idea

  1. Find or create(if not available) a js library that can create and save PDF files to server from blob. (I looked through some of them like 'jsPDF','pdfkit' but none of them use blob)

  2. Save the file to server with a valid name

  3. use the above name in the iframe.

If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment