js获取文件md5散列值 - HTML+JS方法
Posted Rudon滨海渔村
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js获取文件md5散列值 - HTML+JS方法相关的知识，希望对你有一定的参考价值。
效果图
实现步骤（最简单方法 - CDN）
<!DOCTYPE html>
<html>
<head>
<title>speak-MD5</title>
</head>
<body>
<input type="file" name="" id='file'>
<script type="text/javascript" src="//lib.sinaapp.com/js/jquery/3.1.0/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="https://cdn.staticfile.org/spark-md5/3.0.0/spark-md5.min.js"></script>
<script type="text/javascript">
$('#file').change(function()
let data = this.files[0];
console.log(data)
calculate(data, function(md5)
console.log(md5) //hash值
alert(md5)
)
)
function calculate(file, callBack)
let fileReader = new FileReader(),
blobSlice = File.prototype.mozSlice || File.prototype.webkitSlice || File.prototype.slice,
chunkSize = 2097152,
// read in chunks of 2MB
chunks = Math.ceil(file.size / chunkSize),
currentChunk = 0,
spark = new SparkMD5();
fileReader.onload = function(e)
spark.appendBinary(e.target.result); // append binary string
currentChunk++;
if (currentChunk < chunks)
loadNext();
else
callBack(spark.end());
;
function loadNext()
let start = currentChunk * chunkSize,
end = start + chunkSize >= file.size ? file.size : start + chunkSize;
fileReader.readAsBinaryString(blobSlice.call(file, start, end));
;
loadNext();
</script>
</body>
</html>php md5_file() 函数
https://www.w3school.com.cn/php/func_string_md5_file.asp
更多
<!-- 连不上 -->
<!-- <script src="//cdn.rawgit.com/satazor/SparkMD5/master/spark-md5.min.js"></script> -->
<!-- npm安装+JS普通引入 -->
<!-- npm install --save spark-md5 -->
<!-- <script src="./node_modules/spark-md5/spark-md5.min.js"></script> -->
<!-- npm安装+require引入 -->
<!-- npm install --save spark-md5 -->
<!-- let SparkMD5 = require('spark-md5') -->以上是关于js获取文件md5散列值 - HTML+JS方法的主要内容，如果未能解决你的问题，请参考以下文章