jarrodhroberson
11/26/2013 - 12:09 AM

Reading a File in chunks with the HTML5 FileReader API and calculating MD5 hash codes of the contents with the spark-md5 library in a WebWor

Reading a File in chunks with the HTML5 FileReader API and calculating MD5 hash codes of the contents with the spark-md5 library in a WebWorker.

CalcMD5Worker.js
content_copyfile_download
importScripts('spark-md5.min.js');

function calcMD5(f) {
    var blobSlice = Blob.prototype.slice;
    var chunkSize = 2097152;
    var chunks = Math.ceil(f.size/chunkSize);
    var spark = new SparkMD5.ArrayBuffer();
    var currentChunk = 0;

    var fr = new FileReader();
    fr.onload = function(e) {
        spark.append(e.target.result);
        if (currentChunk === chunks) {
            postMessage({name:f.name, md5:spark.end()});
        } else {
            postMessage({name:f.name, md5:currentChunk+' / '+chunks});
            var start = currentChunk * chunkSize;
            var end = ((start + chunkSize) >= f.size) ? f.size : start + chunkSize;
            fr.readAsArrayBuffer(blobSlice.call(f, start, end));
            currentChunk++;
        }
    };
    fr.onerror = function(e) {
        postMessage({name:f.name, md5:e.message});
    };
    // kick off the reading of the file
    fr.readAsArrayBuffer(blobSlice.call(f,currentChunk + chunkSize, chunkSize));
}

onmessage = function(e) {
    e.data.forEach(function(f){
        calcMD5(f);
    });
};