save as dialog box in Firefox - javascript

I want to show the Save as dialog box when a user clicks an HTML button.
I am using DOJO and JavaScript.
In IE document.exec comes to rescue but in Firefox one needs to make changes in filesystem to use NSI.
Any idea will be appreciated.

You can force the browser to download some data using a data url:
content = "This is the text for downloading";
window.location.href = "data:application/octet-stream,"+
encodeURIComponent(content);
The main problem with this is that the user will not be able to choose a filename and the generated filename is some random hash. If you don't mind using Flash, you could use Downloadify, this will give you more control over the Save dialog.

Have the HTML button href to a unknown document type. Say FileName.xxxblah.
This will automatically trigger the Save as Dialog.

It's not exactly what you're looking for, but the only reliable way I know of is to create a server side script on the server which will send the correct headers. In PHP this is how you'd do it:
header('Content-type: text/csv');
header('Content-Disposition: attachment; filename="mydocument.csv";' );
header('Content-length: '.(int)strlen($csvData));
print($csvData);
Content-type is the "mime type" of the document, and for compatibility with some browsers it's important this perfectly matches the extension of the filename.
Content-Disposition: attachment instructs the browser to download the page, even if it wouldn't normally do so for that mime-type, and you're able to provide the filename.
Content-length is the size of the download, this is optional but it must be provided if you want the user to see a progress bar for the download.
Some browsers will present a save as dialog, while others will simply save the file to the user's preferred download folder. You don't have much control over which will happen.

Related

How to display a PDF without downloading

I have a PDF like like this:
"http://centraldata.s3.amazonaws.com/.....pdf?AWSAccessKeyId=...."
which I get from an api call. Then I pass it into an link so that users can click and download it.
<a href={pdfUrl} />
So, my question is, is there a way to let user view the PDF without downloading it? Except passing the Url into an tag, I don't know if there is any other way to use this link
When you place a page of HTML in the Public Domain (World Wide Web) you are offering a service with Dis-positions (Download to later view this page after decoding download).
If you include images, text, audio, video or even a PDF via link, then you are offering to disposition a copy of the page content (be dispossessed of all with its content) from the server to the browser.
A web site can indicate to the browser that the download need not be viewed in the browser, (many browsers do not have a PDF viewer, or the browser may be secured to a safer setting such as Download Media ONLY) the HTTP response could include the html attachment headers:
Content-Type: application/pdf
Content-Disposition: attachment; filename="file.pdf"
A web site can indicate to the browser that the download need not be viewed in the browser, but there is a possibility if the user settings allow for inline viewing, (many browsers do not have a PDF viewer or it may be secured to a safer setting such as Download ONLY) the HTTP response should include the html attachment headers:
Content-Type: application/pdf
Content-Disposition: inline; filename="file.pdf"
To avoid problems with the text parsing of the optional filename (blob: or anything will be saved to filename at the discretion of the client dispossesser) then the proffered optional filename should be "double quoted".
User security settings should ideally be set to no-popups, like blanks, open secondary windows or target tabs, since those are unfriendly, anti-social server actions.
W3 Recommendation says
< a href="download-file.pdf" download >right click here for your options including view now< /a>
If you as my client have an inline PDF viewer active, here is an iframe should you wish to use it. (Your servant)
The next two related questions are
How can I stop that content I duplicated, from being duplicated as a copy by the client?, well clearly you cannot, since you willingly gave it away and once decrypted and decoded by the receiver it belongs to them as editable dis possessed content.
How can I mask the source URL ?, generally you can not since to decode the whole file and maintain it (if required) the sending caller ID must be maintained as an open comms channel during viewing. (Much like satellite download or Netflix recordings on demand.)
just use this
MyPDF

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

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
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/ .
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
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)
Save the file to server with a valid name
use the above name in the iframe.

Is it possible to programatically set the "from:" field in a Firefox file open dialog using javascript

I am generating a file open dialog which allows the user to download a blob I have generated in code. This works fine but in Firefox the "from:" field on the open dialog looks like:
from: blob:
Is it possible to programmatically set this with javascript so that I can specify the domain the data actually originates from?
For example if the blob was generated from data on www.stackoverflow.com I would like the open dialog to look like:
from: www.stackoverflow.com
No, you cannot influence the "From:" description in the Save dialog. Otherwise folks would abuse this.
However, it is indeed unfortunate that blob URIs display this poorly. Consider filing a bug (or even creating a patch) to rectify this.

Writing string content as PDF

I have already build functionality to generate pdf file for reports that user view.
So what it currently does is when user clicks to the print pdf button it
Get the html content of the div that needs to be printed
Send this content to the controller's method using jquery ajax method with POST
In the controller it wraps the content with html document strings like <html>, <body> etc. plus I add some styles there.
Then this html string is passed to one of the tools I am using that returns me pdf bytes for this string
Then its saves those bytes as pdf file in a folder and returns the path of this file.
Jquery then on success method opens up the window for this file's path.
This all is working fine.
The problem is
It does not immediately opens up the window as it does all the processing and then on success it opens the window
Plus I am wondering if I am doing this all correctly or doing some extra unnecessary steps, from this I mean is there any better way or short way to do this.
Something like after getting content of div make some changes to the string to directly show it in the new window as pdf content etc. to avoid server processing, is that possible?
Till now I have tried to show the content directly with data:application/pdf but that didn't work.
If that is not possible, I am thinking to avoid saving of pdf file but just show the view that will open up as pdf, may be by setting its content-type, is that possible?
What you did is the best approach. (All) browsers don't have the capability to convert html to pdf so you can't just order them to open a page as pdf. You must serve the pdf file from the server. For more control you can serve the file from a script at a specified url and add appropriate headers:
header('Content-type: application/pdf');
header('Content-Disposition: inline; filename="the.pdf"'); // second parameter is the name of the file
Content type means browser will try to open it with a program appropriate for this MIME type.
Content Disposition inline means that browser will try to open it in the browser.
As server is working just display "loading" image to the user. That way the user will know that something is happening and that he needs to wait.

how to download client side content

I want to let the user download the current content of a textarea into a text file on their computer. In the past I would create an iframe pointing to a URL with the data, which would trigger a file download dialog. However this time the data is client side.
So, is it possible to let the user download data without sending it server side?
If it does not need to work in "old browsers" like IE, you could open a new window with the location 'data:text/plain,' + yourTextarea.value. The user can then save that file using the File/Page menu or Ctrl+S.
is it possible to let the user download data without sending it server side?
In the general case no.
It is possible with a data: URL, as in janmoesen's answer (although you should be URL-encoding the value to include in the URL, or you may face corruption when a %nn sequence appears in the data).
However, this becomes impractical for very long data, and it's not available in old browsers or IE. (IE8 allows short data URLs to be used for images, but not direct navigation.) So whilst you can include a data-URL method to enhance the process on browsers that support it, you will still need a fallback solution of sending a formful of the data to the server side and having it spit back a file in response.
(For security reasons, this should only be allowed in a POST request, and the server should include Content-Disposition: attachment in the response. A content-echo script can give you cross-site-scripting problems otherwise.)
Check out how File and Blob types work.
You can create one and trigger a download programmaticaly:
https://www.bennadel.com/blog/3472-downloading-text-using-blobs-url-createobjecturl-and-the-anchor-download-attribute-in-javascript.htm
https://blog.logrocket.com/programmatic-file-downloads-in-the-browser-9a5186298d5c/

Categories

Resources