Create a file using Javascript in Chrome on client side
Sure you can, using the brand new APIs.
window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem; window.requestFileSystem(window.TEMPORARY, 1024*1024, function(fs) { fs.root.getFile('test.bin', {create: true}, function(fileEntry) { // test.bin is filename fileEntry.createWriter(function(fileWriter) { var arr = new Uint8Array(3); // data length arr[0] = 97; // byte data; these are codes for 'abc' arr[1] = 98; arr[2] = 99; var blob = new Blob([arr]); fileWriter.addEventListener("writeend", function() { // navigate to file, will download location.href = fileEntry.toURL(); }, false); fileWriter.write(blob); }, function() {}); }, function() {});}, function() {});
Enter this into the Chrome browser
data:text;charset=utf-8,helloWorld
So to construct the download for your users you would do something like
data='<a href='data:text;charset=utf-8,'+uriEncode(yourUSERdataToDownload)+' >Your Download</a>
Then inject it into the dom for your user to press.
The following method works in IE11+, Firefox 25+ and Chrome 30+:
<a id="export" class="myButton" download="" href="#">export</a><script> function createDownloadLink(anchorSelector, str, fileName){ if(window.navigator.msSaveOrOpenBlob) { var fileData = [str]; blobObject = new Blob(fileData); $(anchorSelector).click(function(){ 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"; createDownloadLink("#export",str,"file.txt"); });</script>
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.