html5大文件上传技术（四）

最新推荐文章于 2024-08-01 22:22:20 发布

无心2046

最新推荐文章于 2024-08-01 22:22:20 发布

阅读量2k

点赞数

本文链接：https://blog.csdn.net/u012743824/article/details/78927917

版权

本文介绍了如何使用js-spark-md5库在前端计算文件MD5值，用于大文件上传时的校验。通过计算文件MD5并和服务器已有的文件进行比较，如果相同则避免重复上传，节省资源和时间。

摘要由CSDN通过智能技术生成

五、MD5文件校验

基于js-spark-md5前端js类库，可快速获取文件Md5值，点击下载：spark-md5.js

一个分片读取大文件MD5值得范例（引用）

 <body>  <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>
            </div>    
      <script src="Scripts/spark-md5.js"></script>
      <script>
        function get_filemd5sum(ofile) {
            var file = ofile;
            var tmp_md5;
            var blobSlice = File.prototype.slice || File.prototype.mozSlice || File.prototype.webkitSlice,
                // file = this.files[0],
                chunkSize = 2 * 1024 * 1024, // Read in chunks of 2MB
                chunks = Math.ceil(file.size / chunkSize),
                currentChunk = 0,
                spark = new SparkMD5.ArrayBuffer(),
                fileReader = new FileReader();
            fileReader.onload = function(e) {
                // console.log('read chunk nr', currentChunk + 1, 'of', chunks);
                spark.append(e.target.result); // Append array buffer
                currentChunk++;
                var md5_progress = Math.floor((currentChunk / chunks) * 100);
                console.log(file.name + "  正在