why this many files? The number of files depends on the number of characters all file names are combined. Why this max? In the Windows API, the maximum path length limitation is 256 chars, the Unicode version API is 32,767 chars. Chrome simply sets the max path length of the Unicode version API, so it’s … Read more
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
Please note that Filesystem API is no longer part of the standard’s specification, as specified at: http://www.w3.org/TR/file-system-api/ EDIT: Quoting the specification in case the link changes: “File API: Directories and System W3C Working Group Note 24 April 2014 Work on this document has been discontinued and it should not be referenced or used as a … Read more
Way 1: only works for dataURL, not for other types of url. function dataURLtoFile(dataurl, filename) { var arr = dataurl.split(‘,’), mime = arr[0].match(/:(.*?);/)[1], bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n); while(n–){ u8arr[n] = bstr.charCodeAt(n); } return new File([u8arr], filename, {type:mime}); } //Usage example: var file = dataURLtoFile(‘data:image/png;base64,……’, ‘a.png’); console.log(file); Way 2: works … Read more
Yes, read the file as a data URL and pass that data URL to the src of an Image: http://jsfiddle.net/pimvdb/eD2Ez/2/. var fr = new FileReader; fr.onload = function() { // file is loaded var img = new Image; img.onload = function() { alert(img.width); // image is loaded; sizes are available }; img.src = fr.result; // … Read more
There is an html attribute for this specific purpose called accept but it has little support across browsers. Because of this server side validation is recommended instead. <input type=”file” name=”pic” id=”pic” accept=”image/gif, image/jpeg” /> If you don’t have access to the backend have a look at a flash based solution like SWFUpload. See more on … Read more
Prepend \ufeff to the string. See http://msdn.microsoft.com/en-us/library/ie/2yfce773(v=vs.94).aspx See discussion between @jeff-fischer and @casey for details on UTF-8 and UTF-16 and the BOM. What actually makes the above work is that the string \ufeff is always used to represent the BOM, regardless of UTF-8 or UTF-16 being used. See p.36 in The Unicode Standard 5.0, Chapter … Read more
FileReader load event sets the .result value asynchronously. To access the .result use load or loadend event. When a file has been selected at <input type=”file”> Choose File or Browse… UI, deleting file at local filesystem should not effect the File object at FileList returned by .files call. See 2.9.2. Transferable objects, 6.7.3 The DataTransfer … Read more
If you need to send it over ajax, then there’s no need to use a File object, only Blob and FormData objects are needed. As I sidenote, why don’t you just send the base64 string to the server over ajax and convert it to binary server-side, using PHP’s base64_decode for example? Anyway, the standard-compliant code … Read more
Yes, read the file as a data URL and pass that data URL to the src of an Image: http://jsfiddle.net/pimvdb/eD2Ez/2/. var fr = new FileReader; fr.onload = function() { // file is loaded var img = new Image; img.onload = function() { alert(img.width); // image is loaded; sizes are available }; img.src = fr.result; // … Read more