HTML5 File API - slicing or not?

问题

There are some nice examples about file uploading at HTML5 Rocks but there are something that isn't clear enough for me.

As far as i see, the example code about file slicing is getting a specific part from file then reading it. As the note says, this is helpful when we are dealing with large files.

The example about monitoring uploads also notes this is useful when we're uploading large files.

Am I safe without slicing the file? I meaning server-side problems, memory, etc. Chrome doesn't support File.slice() currently and i don't want to use a bloated jQuery plugin if possible.

回答1:

Both Chrome and FF support File.slice() but it has been prefixed as File.webkitSlice() File.mozSlice() when its semantics changed some time ago. There's another example of using it here to read part of a .zip file. The new semantics are:

Blob.webkitSlice( 
  in long long start, 
  in long long end, 
  in DOMString contentType 
); 

Are you safe without slicing it? Sure, but remember you're reading the file into memory. The HTML5Rocks tutorial offers chunking the upload as a potential performance improvement. With some decent server logic, you could also do things like recovering from a failed upload more easily. The user wouldn't have to re-try an entire 500MB file if it failed at 99% :)

回答2:

This is the way to slice the file to pass as blobs:

function readBlob() {
    var files = document.getElementById('files').files;
    var file = files[0];
    var ONEMEGABYTE = 1048576;
    var start = 0;
    var stop = ONEMEGABYTE;

    var remainder = file.size % ONEMEGABYTE;
    var blkcount = Math.floor(file.size / ONEMEGABYTE);
    if (remainder != 0) blkcount = blkcount + 1;

    for (var i = 0; i < blkcount; i++) {

        var reader = new FileReader();
        if (i == (blkcount - 1) && remainder != 0) {
            stop = start + remainder;
        }
        if (i == blkcount) {
            stop = start;
        }

        //Slicing the file 
        var blob = file.webkitSlice(start, stop);
        reader.readAsBinaryString(blob);
        start = stop;
        stop = stop + ONEMEGABYTE;

    } //End of loop

} //End of readblob

来源：https://stackoverflow.com/questions/7594760/html5-file-api-slicing-or-not