StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>There are a couple of things wrong with your current approach:</p> <p>You don't need the <code>FileWriter</code> API. That cannot be used without the <a href="http://www.html5rocks.com/en/tutorials/file/filesystem/" rel="nofollow">HTML5 Filesystem API</a>. What you do need is the <code>BlobBuilder</code> API from the <a href="http://www.w3.org/TR/file-writer-api/" rel="nofollow">File API: Writer spec</a>.</p> <p>Second, the <code>FileReader</code> read methods are asynchronous, so you can't pass the result to <code>doSomething()</code> like you're doing. You also need to create a separate reader object for each file. </p> <p>One thing you could try is to read the file as an <code>ArrayBuffer</code>, manipulate its bytes via a JS typed array (<code>Uint8Array</code>), create a Blob from that buffer, then send the result to the server. Something like this might work (untested):</p> <pre><code>$(function() { $("#files").change(function(e) { var files = e.target.files; [].forEach.call(files, function(f, i) { var reader = new FileReader(); reader.onload = function(e) { doSomething(this.result); }; reader.readAsArrayBuffer(f); }); return true; }); }); var doSomething = function(arrayBuffer) { // Create a unsigned 8-bit view from the underlying data buffer. var ui8a = new Uint8Array(arrayBuffer); for (var i = 0; i < ui8a.length; ++i) { // Manipulate each byte. Its underlying arraybuffer will be changed. // ui8a[i] = xxx // set byte at offset i to something. } var bb = new WebKitBlobBuilder(); // Build a blob from the arraybuffer data. bb.append(ui8a.buffer); upload(bb.getBlob('your/filemimetype')); }; var upload = function(blob) { var xhr = new XMLHttpRequest(); xhr.open('POST', '/server', true); xhr.onload = function(e) { ... }; xhr.send(blob); }; </code></pre> <p>I'm not sure if you need the mimetype passed into <code>bb.getBlob()</code>, but that would be the content type of the file you're working with. Try it.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload