javascript - How to serve blob and have good filename for all users? - Stack Overflow

admin管理员组

文章数量:1401673

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

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

• javascript
• pdf
• blob

Share Improve this question Follow edited Nov 18, 2017 at 10:04 Greenbeard 50955 silver badges1414 bronze badges asked Nov 11, 2017 at 23:07 mlissnermlissner 18.2k1818 gold badges121121 silver badges176176 bronze badges 1

• reference to topic but regarding UX concerns: ux.stackexchange./questions/38574/… – Sgnl Commented Nov 24, 2017 at 21:04

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3 +25

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/PluginDetect/PDFjs/ .

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

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

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.

本文标签： javascriptHow to serve blob and have good filename for all usersStack Overflow