前端计算MD5和SHA256方法

分别介绍前端如何计算大文件的MD5和SHA256值

  // 文件md5计算
  loadNext() {
    this.chunks = Math.ceil(this.file.size / this.chunkSize);
    const fileReader = new FileReader();
    fileReader.onload = (e) => {
      const result: any = (e.target as any).result;
      this.spark.append(result);
      this.currentChunk++;
      if (this.currentChunk < this.chunks) {
        this.loadNext();
      }
      else {
        this.mdvalue = this.spark.end();
      }

    };
    const start = this.currentChunk * this.chunkSize;
    const end = ((start + this.chunkSize) >= this.file.size) ? this.file.size : start + this.chunkSize;
    fileReader.readAsArrayBuffer(File.prototype.slice.call(this.file, start, end));
  };
  // 文件sha256计算
  loadFile(){
    var contractFile = this.file;
    const reader = new FileReader();
    // 指定文件分块大小
    var chunkSize = 6 * 1024 * 1024;
    // 计算文件分块总数
    var chunks = Math.ceil(contractFile.size / chunkSize);
    // 指定当前块指针
    var currentChunk = 0;
    const hasher = CryptoJs.algo.SHA256.create();
    // FileReader分片式读取文件
    // 计算开始读取的位置
    var start = currentChunk * chunkSize;
    // 计算结束读取的位置
    var end = start + chunkSize >= contractFile.size ? contractFile.size : start + chunkSize;
    reader.readAsArrayBuffer(File.prototype.slice.call(contractFile, start, end));
    reader.onload = (e) => {
          var fileStr: any = (e.target as any).result;
          var tmpWordArray = CryptoJs.lib.WordArray.create(fileStr)
          hasher.update(tmpWordArray);
          currentChunk += 1;
          fileStr = null;
          tmpWordArray = null;
          // 判断文件是否都已经读取完
       if (currentChunk < chunks) {
           // 计算开始读取的位置
           var start = currentChunk * chunkSize;
           // 计算结束读取的位置
           var end = start + chunkSize >= contractFile.size ? contractFile.size : start + chunkSize;
           reader.readAsArrayBuffer(File.prototype.slice.call(contractFile, start, end));
       }else{
        this.sha256value = hasher.finalize().toString();;
       }
    }
  }

参考文档:

HTML5 File API 配合 Web Worker 计算大文件 SHA3 Hash 值: 

https://blog.izgq.net/archives/1260/

前端页面使用js计算文件的md5和sha256:

https://www.jianshu.com/p/382351750454

前端加密控件CryptoJS的使用: 

https://my.oschina.net/u/4404738/blog/3412099