Take the 2-minute tour ×

Is there any way I can create a text file on the client side and prompt the user to download it, without any interaction with the server? I know I can't write directly to their machine (security and all), but can I create and prompt them to save it?

share|improve this question
What a fascinating question! –  Ben Blank Sep 8 '10 at 6:57
add comment

9 Answers

up vote 117 down vote accepted

You can use data URIs. Browser support varies; see Wikipedia. Example:

<a href="data:application/octet-stream;charset=utf-8;base64,Zm9vIGJhcg==">text file</a>

The octet-stream is to force a download prompt. Otherwise, it will probably open in the browser.

For CSV, try:

<a href="data:application/octet-stream,field1%2Cfield2%0Afoo%2Cbar%0Agoo%2Cgai%0A">CSV Octet</a>z

Try the jsFiddle demo.

share|improve this answer
This is not a cross browser solution but definitely something worth looking at. For example IE limits support to data uri. IE 8 limits size to 32KB and IE 7 and lower doesn't support at all. –  Darin Dimitrov Sep 8 '10 at 6:32
in Chrome Version 19.0.1084.46, this method generates the following warning : "Resource interpreted as Document but transferred with MIME type text/csv: "data:text/csv,field1%2Cfield2%0Afoo%2Cbar%0Agoo%2Cgai%0A"." A download is not triggered –  Chris May 16 '12 at 11:44
@Chris, yes, apparently it doesn't work in Chrome, even with octet-stream. –  Matthew Flaschen May 16 '12 at 14:53
It does work in Chrome now (tested against v20 and v21) but not IE9 (that might just be the jsFiddle, but somehow I doubt it). –  earcam Aug 30 '12 at 16:20
Just to add, in Chrome you can use the attribute download="filename.ext" to name the file (not yet supported in FFox) –  earcam Aug 30 '12 at 17:16
show 3 more comments

Simple solution for HTML5 ready browsers...

function download(filename, text) {
    var pom = document.createElement('a');
    pom.setAttribute('download', filename);


share|improve this answer
Yep. This is exactly what @MatthewFlaschen has posted here about 3 years ago. –  Joseph Silber Aug 12 '13 at 22:01
Yes, but with download attribute you can specify file name ;-) –  Matěj Pokorný Aug 12 '13 at 22:08
As @earcam has already pointed out in the comments above. –  Joseph Silber Aug 13 '13 at 0:30
add comment

I'm happily using FileSaver.js. Its compatibility is pretty good (IE10+ and everything else), and it's very simple to use:

var blob = new Blob(["some text"], {
    type: "text/plain;charset=utf-8;",
saveAs(blob, "thing.txt");
share|improve this answer
Unfortunately, IE10+ is a little steep... –  Joseph Silber May 9 '13 at 4:28
@JosephSilber fair enough :P. –  Daniel Buckmaster May 9 '13 at 22:52
This works great on Chrome. How do I allow the user to specific the location of the file on disk? –  gregm May 22 '13 at 18:40
Wow, thanks for the easy to use library. This is easily the best answer, and who cares about people using HTML < 5 these days any ways? –  notbad.jpeg Jun 19 '13 at 21:16
@gregm I'm not sure you can with this plugin. –  Daniel Buckmaster Jun 20 '13 at 6:23
show 1 more comment

All the above example works just fine in chrome and IE, But fails in Firefox. Please do consider to append anchor to body and remove it after click.

var a = window.document.createElement('a');
a.href = window.URL.createObjectURL(new Blob(['Test,Text'], {type: 'text/csv'}));
a.download = 'test.csv';

// Append anchor to body.

// Remove anchor from body
share|improve this answer
add comment

You can even do one better than just URI's - using Chrome you are also able to suggest the name the file will take, as explained in this blog post about naming a download when using URIs.

share|improve this answer
add comment

Solution that work on IE10: (I needed a csv file, but it's enough to change type and filename to txt)

var csvContent=data; //here we load our csv data 
var blob = new Blob([csvContent],{
    type: "text/csv;charset=utf-8;",

navigator.msSaveBlob(blob, "filename.csv")
share|improve this answer
add comment

The following method works in IE11+, Firefox 25+ and Chrome 30+:

<a id="export" class="myButton" download="" href="#">export</a>
    function createDownloadLink(anchorSelector, str, fileName){
        if(window.navigator.msSaveOrOpenBlob) {
            var fileData = [str];
            blobObject = new Blob(fileData);
                window.navigator.msSaveOrOpenBlob(blobObject, fileName);
        } else {
            var url = "data:text/plain;charset=utf-8," + encodeURIComponent(str);
            $(anchorSelector).attr("download", fileName);               
            $(anchorSelector).attr("href", url);

    $(function () {
        var str = "hi,file";


See this in Action: http://jsfiddle.net/Kg7eA/

Firefox and Chrome support data URI for navigation, which allows us to create files by navigating to a data URI, while IE doesn't support it for security purposes.

On the other hand, IE has API for saving a blob, which can be used to create and download files.

share|improve this answer
add comment

It actually IS possible - use Flash.

You can either generate the content with JS and then initialize some flash vars or just do everything within a flash movie.

Please take a look at this for some important remarks.

share|improve this answer
Please also take a look at this thread: stackoverflow.com/questions/1811736/… –  Mr.RoyDiibs Sep 8 '10 at 6:56
I should have specified this in my question, but I'm looking for a native solution. Otherwise I could use ActiveX (although it'll only work in IE). –  Joseph Silber Sep 8 '10 at 7:07
I believe such a functionality is intentionally blocked –  Mr.RoyDiibs Sep 8 '10 at 7:20
Since the user is being prompted whether to download it or not, I don't see why it should intentionally be blocked. Also, from a security point of view, this should be no different than a regular HTTP download. At least AFAIK... –  Joseph Silber Sep 8 '10 at 7:28
Flash is not supported on mobile –  Yassir Ennazk Oct 4 '13 at 9:38
show 2 more comments

If the file contains text data, a technique I use is to put the text into a textarea element and have the user select it (click in textarea then ctrl-A) then copy followed by a paste to a text editor.

share|improve this answer
I had considered that, but from a user-friendliness point, this is disastrous. Also, the file has to be saved with a CSV extension. Try telling that to your users. –  Joseph Silber Sep 8 '10 at 7:07
add comment

Your Answer


