js实现低内存，超快速，较安全的计算超大文件摘要算法设计

一、基础概念

• Blob: 前端的一个专门用于支持文件操作的二进制对象

• ArrayBuffer：前端的一个通用的二进制缓冲区，类似数组，但在API和特性上却有诸多不同

• Buffer：Node.js提供的一个二进制缓冲区，常用来处理I/O操作

 

https://zhuanlan.zhihu.com/p/97768916

二、整体思路

1. File，通过slice，切片成Blob块；

2. FileReader,异步读取每片Blob,readAsArrayBuffer;

3. 使用支持增量追加和ArrayBuffer的摘要算法库进行逐片计算追加摘要。

三、好处

 

全程arraybuffer，从二进制缓冲区读取,不读入到js数组和字符串 ，保证读取速度；

分片增量追加，分多次追加，而不是单词处理超级大内容，保证低内存消耗；

sha256,安全摘要算法，比MD5更安全；

 

四、代码示例

 

 

五、摘要算法库选型

 

 

名称	arrayBuffer支持	追加支持	npm地址
spark-md5	支持	是	https://www.npmjs.com/package/spark-md5
crypto-js/sha256	否，支持crypto定义的wordArray类型	否	https://www.npmjs.com/package/crypto-js
sha.js	否，支持buffer，对nodejs友好	是	https://www.npmjs.com/package/sha.js
js-sha256	是	是	https://www.npmjs.com/package/js-sha256
sha3-js	是	是	https://www.npmjs.com/package/js-sha3

 

六、推荐

js-sha256+分片fileReader读arraBuffer组合。

 

 

参考

1. html5 - javascript FileReader - parsing long file in chunks - Stack Overflow

2. File | MDN

3. Streams API | MDN

4. WritableStream | MDN

5. A Guide to Faster Web App I/O and Data Operations with Streams - Blog | SitePen

6. ArrayBuffer - ECMAScript 6入门

7. Streams Standard

8. The Basics of Web Workers - HTML5 Rocks

9. WEB WORKER配合FILE API，加速前端秒传读取MD5

10. node如何实现大文件上传

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