[Edit] As noted in comments above, while still on some UA implementations, readAsBinaryString method didn’t made its way to the specs and should not be used in production. Instead, use readAsArrayBuffer and loop through it’s buffer to get back the binary string : document.querySelector(‘input’).addEventListener(‘change’, function() { var reader = new FileReader(); reader.onload = function() { … Read more
The canvas element provides a toDataURL method which returns a data: URL that includes the base64-encoded image data in a given format. For example: var jpegUrl = canvas.toDataURL(“image/jpeg”); var pngUrl = canvas.toDataURL(); // PNG is the default Although the return value is not just the base64 encoded binary data, it’s a simple matter to trim … Read more
There are a number of ways of triggering a download. Following are a few: Use a form: <form method=”get” action=”mydoc.doc”> <button type=”submit”>Download</button> </form> Use javascript: <button type=”submit” onclick=”window.open(‘mydoc.doc’)”>Download</button>
You can set webkitdirectory and allowdirs attributes at <input type=”file”> element; attach change, drop events to <input type=”file”> element; use .getFilesAndDirectories() at mozilla, .createReader(), .readEntries() at webkit, Array.prototype.reduce(), Promise, recursion. Note at firefox drop event does not list selection as a Directory, but a File object having size 0, thus dropping directory at firefox does … Read more
Ok, you want to “Remember and Repopulate File Input“, “remember their choice and redisplay the file input with the file pre-selected on reload of the page“.. And in the comment to my previous answer you state that you’re not really open to alternatives: “Sorry but no Flash and Applets, just javscript and/or file input, possibly … Read more
User Matt has proposed the following code a year ago ( How to convert dataURL to file object in javascript? ) which might help you EDIT: As some commenters reported, BlobBuilder has been deprecated some time ago. This is the updated code: function dataURItoBlob(dataURI) { // convert base64 to raw binary data held in a … Read more
Modern solution: let blob = await fetch(url).then(r => r.blob()); The url can be an object url or a normal url.
The problem is that the observable runs in another context, so when you try to create the URL var, you have an empty object and not the blob you want. One of the many ways that exist to solve this is as follows: this._reportService.getReport().subscribe(data => this.downloadFile(data)),//console.log(data), error => console.log(‘Error downloading the file.’), () => console.info(‘OK’); … Read more
Edit: As proven by OP, in one of their gist, there is actually a way to do it… The DataTransfer constructor (currently only supported by Blink, and FF >= 62), should create a mutable FileList (chrome currently always return a new FileList, but it doesn’t really matter for us), accessible through the DataTransferItemList. If I’m … Read more