Im trying to dynamically create a CSV file using javascript that the user can download. This only has to work in IE.
The html the javascript generates looks something like this
CSV
Which seams to work fine in chrome but IE10 just breaks.
Is there a better way to dynamically create a file using JavaScript and then give the user a link to download it? I cant use PHP as the entire system needs to run on the client-side due to restrictions placed by the user. The system all needs to work on a touch screen (with no right click option) so the link needs to give the user the ability to download, not open the file.
Internet Explorer 10 doesn't support the data protocol on the a element. Per the documentation, the only supported elements/attributes are the following:
object (images only)
img
input type=image
link
CSS declarations that accept a URL, such as background, backgroundImage, and so on.
You should know that what you're attempting to do smells like a phishing attempt; for this reason you shouldn't expect browsers to support this pattern. You can read more about data-uri phishing in the paper Phishing by data URI.
I had the same problem, I download the data uri in this way with Chrome:
var link = document.createElement("a");
link.download = dataItem.Filename;
link.href = data;
link.click();
But it does not work in Internet Explorer. I have found a library that works in Internet Explorer, https://github.com/rndme/download
The only issue for me is the dowload of files with longer MIME type like odt, docx, etc. For all the other kind of files it look great!
Related
I have this extremely simple HTML:
<a download="red.png"
href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==">
Static
</a>
In Chrome or Firefox, it downloads red.png as expected.
In IE, it navigates to an error page. See it on JSFiddle.
Now, I know the download attribute is not supported in IE, and that's fine. I'd still expect it to navigate to the "file", allowing the user to save it. Instead, it's navigating to an error page.
Is there a way to get around this problem? The Data URI is generated client-side; creating the file on the server is not an option.
Edit: MSDN says:
For security reasons, data URIs are restricted to downloaded
resources. Data URIs cannot be used for navigation, for scripting, or
to populate frame or iframe elements.
...which I read as "Even though every other browser supports this, we don't know how to do it". So, still looking for a workaround to download a file generated on the client.
Since IE does not support either navigating to a data URI, nor the download attribute, the solution is to use navigator.msSaveBlob to generate the file and prompt the user to save it.
Credit goes to this answer.
Is there any way I can find out what the latest file Selenium downloaded was, and from where (what URL) it was downloaded?
I am fetching files from a large number of sites (that I do not control) by clicking on elements, and my problem is that I do not know how the files are downloaded. Sometimes it is just an <a> element, sometimes there is a Javascript event attached to some element, or form (not always obvious from inspection), and so on, and so on.
So I though the easiest would be to just do my clicks, and then check what landed in the download folder. But then I have no idea where that file came from, and I also need to store the url.
For files that can be displayed inline, I can, of course, open them in the browser and get the driver.current_url. This is very convenient for file formats where it actually works, so if there is a way to force e.g. Firefox or Chrome to open all files inline, that would also be an option. (I am aware of one such extension. That extension, however, requires some user interaction in a OS file dialogue window, and that seems like overkill here)
Possible solutions
Firefox: Read moz_downloads from downloads.sqlite, in the FF SQLite DB
Chrome: Read the corresponding SQLite db for Chrome/ium
Write browser extensions that modifies the mimetype of visited pages, so that all files are opened as plain in the browser, and the URLs can be accessed from there.
How I understanding selenium it only insert js to page, that mean that you can interact only with web page but not with browser futures.
But you can do like in this post How to access Google Chrome browser history programmatically on local machine if that files are in download history you can find them there.
I want to offer both View and Download options for downloadable documents on a webpage. ie. I want to force the browser to either use a plugin viewer or save directly to the computer. These documents will most likely be PDF or word and possibly others. Is there a way I can do that directly in the html/css/javascript? I do not have access to the server itself. Preferably all browsers will support this.
EDIT: Both answers are good ones so I won't chose one in particular. Instead I'll vote both of them up.
To get the link to force download you could use the following HTML5 option.
<a href='file.pdf' download=''>Link [Download]</a>
To view in the browser you could also have the following link:
<a href='file.pdf'>Link [View]</a>
Though TheShinyTuxedo's answer will work, it wont work with older browsers which don't support HTML 5.
To support all browsers, make your link like this:
Download
By setting target="_blank", your browser will open the file in a new tab and immediatly close it and download the file
Ok in response to your comment, this is gonna be tricky which will require a bit of additional work...
Assuming you are using php, the solution is to create a download script which sends headers to the browser explicitly telling it to download the file.
So First create a download.php file and put the following script in:
<?php
$filename = $_GET["file"]
header("Content-disposition: attachment; filename=".$filename);
header("Content-type: application/pdf");
readfile($filename);
?>
Then your download link would look like this:
Download
This should work because the headers sent to the browser explicitly tells the browser, that the following content is ment to be donwloaded and not just displayed.
P.S: If you are using just html, then I don't think there is a solution...
I am creating a HTML 5 user manual. This contains a number of image folders and js fodlers. Now i wish to distribute this as a single document. In Windows there is mht or something to that effect. Is there any way I can do this on ubuntu that is not browser or OS dependent?
notice that :MHTML, short for MIME HTML, is a web page archive format used to bind resources which are typically represented by external links (such as images, Flash animations, Java applets, audio files) together with HTML code into a single file. The content of an MHTML file is encoded as if it were an HTML email message, using the MIME type multipart/related. The first of the file is normally encoded HTML; subsequent parts are additional resources identified by their original URLs and encoded in base64. This format is sometimes referred to as MHT, after the suffix .mht given to such files by default when created by Microsoft Word, Internet Explorer or Opera. MHTML is a proposed standard, circulated in a revised edition in 1999 as RFC 2557.
So try to save document as regular html with none of dependency. this will be run at any OS independently.
Well, as far as I know you won't be able to really distribute this manual as HTML OS independent.
BUT: you can distribute it as PDF, ZIP-file, host it anywhere, ePub, etc. These are pretty good options for your needs. Safari has a pretty cool feature called webarchive, but this only zips ONE single page to a viewable, always-the-same-looking page. And it will only be viewable with Safari. So you'd have to do this for ALL your pages...
Does HTML 5 allow to invoke save file dialog with file created in JavaScript?
Yes, but you don't really need HTML5 for it, what you can use is a Data URI. There are several limitations, like IE8 only allows files up to 32Kb, and you'll need to get the user to click on a link. See my answer to a similar question for an example.
In the future you may be able to use the File Writer API, but I'm not aware of any browser support for that yet.
I've tested data-uri approach. Currently it works only in Firefox.
Seems that for now it is better to stay with flash: https://github.com/dcneiner/Downloadify