SHA256 Hashing Large files in angular 6 using Filereader Issue答案

【问题标题】：SHA256 Hashing Large files in angular 6 using Filereader IssueSHA256 Hashing Large files in angular 6 using Filereader Issue
【发布时间】：2020-05-17 03:46:30
【问题描述】：

我对 SHA256 哈希有疑问。如果文件大小超过 250 MB，它将终止浏览器并崩溃。以下是哈希码，请帮助我们。

let fileReader = new FileReader();
fileReader.readAsArrayBuffer(fileToSend);

  fileReader.onload = (e) => {
  const hash = CrypTo.SHA256(this.arrayBufferToWordArray(fileReader.result)).toString();
  this.hashCode=hash;
  this.fileHistory.MediaHash = hash;
  this.fileHistory.FileName = fileToSend.name;

  //Insert to file history
  this.fileHistoryService.postFiles(this.fileHistory).subscribe(
    data => {
      this.hashCode=data["MediaHash"];
      this.alertService.success('HASHFILE.FileUploadSuccessMessage', true);
      this.hideGenerateHashCodeButton = true;
    },
    error => {
       this.alertService.error('COMMONERRORMESSAGE.SomethingWentWrongErrorMessage');
  });

}

arrayBufferToWordArray(fileResult) {
    var i8a = new Uint8Array(fileResult);
    var byteArray = [];
    for (var i = 0; i < i8a.length; i += 4) {
      byteArray.push(i8a[i] << 24 | i8a[i + 1] << 16 | i8a[i + 2] << 8 | i8a[i + 3]);
    }
    return CrypTo.lib.WordArray.create(byteArray, i8a.length);
  }

【问题讨论】：

标签： javascript angular typescript sha256 cryptojs

【解决方案1】：

下面的代码我测试了所有大文件，修复了我的解决方案。

var hashdata = CrypTo.algo.SHA256.create();
      var file =**<FiletoHash>**;
          if(file){
            var reader = new FileReader();
            var size = file.size;
            var chunk_size = Math.pow(2, 22);
            var chunks = [];

            var offset = 0;
            var bytes = 0;
        reader.onloadend = (e) =>{
              if (reader.readyState == FileReader.DONE){

               //every chunk read updating hash
                hashdata.update(this.arrayBufferToWordArray(reader.result));

                let chunk:any = reader.result;
                bytes += chunk.length;
                chunks.push(chunk);
                if((offset < size)){
                  offset += chunk_size;
                  var blob = file.slice(offset, offset + chunk_size);
                  reader.readAsArrayBuffer(blob);
                } else {
                  //use below hash for result
                  //finaly generating hash
                  var hash = hashdata.finalize().toString();

                 //debugger;
                };
              }
            };
            var blob = file.slice(offset, offset + chunk_size);
            reader.readAsArrayBuffer(blob);
          }

    }
  }

  arrayBufferToWordArray(fileResult) {
    var i8a = new Uint8Array(fileResult);
    return CrypTo.lib.WordArray.create(i8a, i8a.length);
  }

【讨论】：

我对你的算法有了大致的了解。 bytes 和 chunks 没有被使用，这很奇怪。另外，如果您将每个结果存储在一个块中，您不是将整个文件加载到内存中吗？为什么要绑定onloadend 而不是onload？后者消除了对您的第一个 IF 的需要。

【解决方案2】：

您绝对应该使用流或类似的东西来避免将所有文件加载到您的内存中。

具体使用CryptoJS，我已经看到可以执行渐进式哈希。

var sha256 = CryptoJS.algo.SHA256.create();
sha256.update("Message Part 1");
sha256.update("Message Part 2");
sha256.update("Message Part 3");

var hash = sha256.finalize();

因此，使用FileReader 读取文件的部分内容，然后每次读取部分内容时，更新 sha256 直到没有更多内容可读取。

见：

filereader api on big files

【讨论】：

你给我的链接我试过了，但它在打字稿中不起作用。你有什么打字稿的解决方案吗？
我找到了这些文章，有帮助吗？：gist.github.com/ahoward/4394394 和 stackoverflow.com/questions/25810051/…
我尝试使用上述解决方案生成 sha256 哈希。但它给出了不同的哈希值。谁能给我完整的解决方案
NEUT 解释的任何方法都是正确的，但在打字稿中我无法解决问题，请帮帮我。