在浏览器端要计算md5 hash,在不安装浏览器插件的情况下需要浏览器能支持读取本地文件,即支持 FileAPI。因此又是 IE 这货不支持。各浏览器兼容看这里:http://caniuse.com/#feat=fileapi
首先需要引入js文件(二选一):
https://raw.github.com/satazor/SparkMD5/master/spark-md5.js
https://github.com/satazor/SparkMD5/blob/master/spark-md5.js
示例代码(需要更换spark-md5.js的路径):
<html>
<head>
<script type="text/javascript" src="spark-md5.js" ></script>
</head>
<body>
<input type="file" id="file" />
<div id="box"></div>
<button id="cal" type="button" οnclick="calculate()">计算md5</button>
</body>
<script>
function calculate(){
var fileReader = new FileReader(),
box=document.getElementById('box');
blobSlice = File.prototype.mozSlice || File.prototype.webkitSlice || File.prototype.slice,
file = document.getElementById("file").files[0],
chunkSize = 2097152,
// read in chunks of 2MB
chunks = Math.ceil(file.size / chunkSize),
currentChunk = 0,
spark = new SparkMD5();
fileReader.onload = function(e) {
console.log("read chunk nr", currentChunk + 1, "of", chunks);
spark.appendBinary(e.target.result); // append binary string
currentChunk++;
if (currentChunk < chunks) {
loadNext();
}
else {
console.log("finished loading");
box.innerText='MD5 hash:'+spark.end();
console.info("computed hash", spark.end()); // compute hash
}
};
function loadNext() {
var start = currentChunk * chunkSize,
end = start + chunkSize >= file.size ? file.size : start + chunkSize;
fileReader.readAsBinaryString(blobSlice.call(file, start, end));
};
loadNext();
}
</script>
</html>