I was wondering whether it is possible to force a browser (at least Chrome) to download a data:text/plain
URL.
Chrome does download binary URLs (e.g. data:application/zip;base64,...
), but it does not download files that can be viewed inside the browser (such as text files).
What I already tried with no luck so far is this:
data:text/plain;content-disposition=attachment;filename=test.txt;...
But it seems like I cannot add headers like this.
Is there any way to make Chrome download a data:text/plain,...
URL?
As of now, it has been made possible to use <a download>
in Chrome. Using dispatchEvent
, you can download any string as file (even with a custom filename) whenever you want. Here's a utility function to use it:
var downloadFile = function(filename, content) {
var blob = new Blob([content]);
var evt = document.createEvent("HTMLEvents");
evt.initEvent("click");
$("<a>", {
download: filename,
href: webkitURL.createObjectURL(blob)
}).get(0).dispatchEvent(evt);
};
Usage:
downloadFile("foo.txt", "bar");
It uses jQuery and the webkit
prefix, but both can be avoided.
Try this:
<a download="file_downloaded_via_data_URL.txt"
href="data:text/plain;base64,SGVsbG8sIHdvcmxkISBJJ20gZG93bmxvYWRlZCB2aWEgImRhdGE6dGV4dC9wbGFpbjsuLi4iIFVSTCB1c2luZyA8YSBkb3dubG9hZD0iZmlsZV9uYW1lIi4uLj4uDQpNeSBiaXJ0aHBsYWNlOiBodHRwOi8vc3RhY2tvdmVyZmxvdy5jb20vcXVlc3Rpb25zLzY0Njg1MTcvDQoNCk1vcmUgYWJvdXQ6DQpodHRwOi8vd3d3LnczLm9yZy9UUi9odG1sL2xpbmtzLmh0bWwjYXR0ci1oeXBlcmxpbmstZG93bmxvYWQNCmh0dHA6Ly93d3cudzMub3JnL1RSL2h0bWwvbGlua3MuaHRtbCNkb3dubG9hZGluZy1yZXNvdXJjZXMNCg0KQnJvd3NlciBzdXBwb3J0OiBodHRwOi8vY2FuaXVzZS5jb20vZG93bmxvYWQ=">
Download text file
</a>
It uses HTML5 attribute download="filename.ext"
. (no JS needed:)
More about: http://www.w3.org/TR/html/links.html#downloading-resources
Browser support can be checked at http://caniuse.com/download
(As for now, 2013, no IE nor Safari support)
I think, you can make a fallback for not-supporting browsers: use JS to change value of href="..."
to the URL of your server script (which will return the file contents with appropriate HTTP header Content-disposition: attachment;filename=filename.txt
).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With