美文网首页
js获取文件md5值

js获取文件md5值

作者: 亻火子 | 来源:发表于2019-11-18 09:40 被阅读0次
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>js获取文章md5值</title>
        <style>
            body{text-align:center;font:14px}
            pre{background:#ffd;border:1px solid orange;padding:1em;margin:0 auto;display:none;text-align:left;}
        </style>
    </head>
    <body>
        <form method="POST" enctype="multipart/form-data" onsubmit="return false;" ><input id=file type=file placeholder="选择文件" /></form>
        <pre id=log></pre>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/spark-md5/3.0.0/spark-md5.min.js"></script>
        <script>
            var log=document.getElementById("log");
            document.getElementById("file").addEventListener("change", function() {
                var blobSlice = File.prototype.slice || File.prototype.mozSlice || File.prototype.webkitSlice,
                    file = this.files[0],
                    chunkSize = 2097152, // 每次读取2MB
                    chunks = Math.ceil(file.size / chunkSize),
                    currentChunk = 0,
                    spark = new SparkMD5.ArrayBuffer(),
                    frOnload = function(e){
                        log.innerHTML+="\n读取文件 "+parseInt(currentChunk+1)+" of "+chunks;
                        spark.append(e.target.result);
                        currentChunk++;
                        if (currentChunk < chunks)
                            loadNext();
                        else
                           log.innerHTML+="\n读取完成!\n\n文件md5:"+spark.end()+"\n";
                    },
                    frOnerror = function () {
                        log.innerHTML+="\n出错了.";
                    };
                function loadNext() {
                    var fileReader = new FileReader();
                    fileReader.onload = frOnload;
                    fileReader.onerror = frOnerror;
                    var start = currentChunk * chunkSize,
                        end = ((start + chunkSize) >= file.size) ? file.size : start + chunkSize;
                    fileReader.readAsArrayBuffer(blobSlice.call(file, start, end));
                };
                log.style.display="inline-block";
                log.innerHTML="选择文件: "+file.name+" ("+file.size.toString().replace(/\B(?=(?:\d{3})+(?!\d))/g, ',')+" bytes)\n";
                loadNext();
            });
        </script>
    </body>
</html>

相关文章

网友评论

      本文标题:js获取文件md5值

      本文链接:https://www.haomeiwen.com/subject/rslvictx.html