javascript计算⽂件MD5浏览器javascript读取⽂件内容
原则上说，浏览器是⼀个不安全的环境。早期浏览器的内容是静态的，⽤户上⽹冲浪，⼀般就是拉取⽹页查看。后来，随着互联⽹的发展，浏览器提供了⾮常丰富的⽤户交互功能。从早期的表单交互，到现在的websocket实时通信，乃⾄html5的流⾏。
html5给前段开发带来了许多有⼒的⼯具，以前浏览器⼤多通过flash插件进⾏⽂件的上传和下载，现在我们可以利⽤html5给我们带来的fileReader api，读取⽤户通过表单选中的⽂件内容。
fileReader详情请移步：
/zh-CN/docs/Web/API/FileReader
javascript 计算⽂件MD5值，请移步：
github/satazor/js-spark-md5
demo实现：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<form id="fileupload" action="" method="POST" enctype="multipart/form-data">
<div>
<div>
添加⽂件
<input type="file" name="" id="fileinput">
</div>
<progress class='progressbar' value="0" max="100" style='width:500px;margin-top:20px'></progress>
<div style='margin-top:20px'>
<span id="handler_info"></span>
</div>
inputtypefile不上传文件</div>
</form>
<script src="./spark-md5.js" type="text/javascript"></script>
<script>
function get_filemd5sum(ofile) {
var file = ofile;
var tmp_md5;
var blobSlice = File.prototype.slice || Slice || File.prototype.webkitSlice,
// file = this.files[0],
chunkSize = 8097152, // Read in chunks of 2MB
chunks = il(file.size / chunkSize),
currentChunk = 0,
spark = new SparkMD5.ArrayBuffer(),
fileReader = new FileReader();
// console.log('read chunk nr', currentChunk + 1, 'of', chunks);
spark.append(sult); // Append array buffer
currentChunk++;
var md5_progress = Math.floor((currentChunk / chunks) * 100);
console.log(file.name + "  正在处理，请稍等," + "已完成" + md5_progress + "%");
var handler_info = ElementById("handler_info");
var progressbar = ElementsByClassName("progressbar")[0];
handler_info.innerHTML=file.name + "  正在处理，请稍等," + "已完成" + md5_progress + "%"
progressbar.value =md5_progress;
if (currentChunk < chunks) {
loadNext();
} else {
tmp_md5 = d();
console.log(tmp_md5)
handler_info.innerHTML = file.name + "的MD5值是：" + tmp_md5;
}
};
console.warn('oops, something went wrong.');
};
function loadNext() {
var start = currentChunk * chunkSize,
end = ((start + chunkSize) >= file.size) ? file.size : start + chunkSize;
}
loadNext();
}
var uploadfile  = ElementById('fileinput')        hange = function(e){
var file = this.files[0];
if(!file) {
alert('请选择⽂件！');
return false;
}
get_filemd5sum(file)
}
</script>
</body>
</html>
结果：
完成效果：