Just for kicks, here it is with a worker thread and File System Access API No idea if either of those things help, I have no 6gb files. This will get the reading off the main thread so that does help performance in some sense. Object.assign( new Worker( URL.createObjectURL( new Blob( [ `self.onmessage = async … Read more
I know only one possible solution, but it’s not really 1-1 fallback for IEs. There are no possible communication API for sending files, because you cannot bind input fields in old browsers, like in a modern ones using FormData. But you can send whole form using an iframe. For this case you can use jquery.form … Read more
You’ve made a couple of errors. The one that the error message is complaining about is that you are trying to select a file using a hard coded string. You cannot determine which file gets loaded. The File API will only allow you to read files that are selected by the user via a File … Read more
I came up with a solution myself which works. function readmultifiles(files) { var reader = new FileReader(); function readFile(index) { if( index >= files.length ) return; var file = files[index]; reader.onload = function(e) { // get file content var bin = e.target.result; // do sth with bin readFile(index+1) } reader.readAsBinaryString(file); } readFile(0); }
Use web workers for large files processing instead doing it in main thread and upload chunks of file data using file.slice(). This article helps you to handle large files in workers. change XHR send to Websocket in main thread. //Messages from worker function onmessage(blobOrFile) { ws.send(blobOrFile); } //construct file on server side based on blob … Read more
In your case File constructor signature is incorrect, the first argument must be: An Array of ArrayBuffer, ArrayBufferView, Blob, or DOMString objects — or a mix of any such objects. This is the file content encoded as UTF-8. https://developer.mozilla.org/en-US/docs/Web/API/File/File#Parameters new File([blob], “filename.json”, {type: “text/json;charset=utf-8”});
readAsText is asynchronous, so you would need to use the onload callback to see the result. Try something like this, var fr = new FileReader(); fr.onload = function(e) { // e.target.result should contain the text }; fr.readAsText(file); Further information here, https://developer.mozilla.org/en-US/docs/DOM/FileReader
[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
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