前端文件用SHA256转hash的三种方法（文件不大的情况下）

场景：在上传文件时，前端获取到所上传文件的hash值，并传给后端

注：此处用到的是SHA256加密

1、开始是搜到了下面这种写法（安装crypto-js）

原文链接：blog.csdn.net/weixin_4305…

getFileHash(value){
    let reader = new FileReader();
    reader.readAsArrayBuffer(value);
    var wordArray = CryptoJS.lib.WordArray.create(reader.result);
    var resHash = CryptoJS.SHA1(wordArray).toString(); // 支持SHA1、MD5、SHA256等算法
    return resHash
  }

但是不知道为什么自己获取到的hash值全部都是空文件的hash值： e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855

2、第二种写法（无需安装包），得到正确值了

    /** 文件转哈希 */
    const getFileHash = (file: any) => {
        const reader = new FileReader();
        reader.readAsArrayBuffer(file);
        reader.onload = function () {
            (async function () {
                let resHash = await crypto.subtle.digest('SHA-256', reader.result).then(a => Array.from(new Uint8Array(a)).map(a => a.toString(16).padStart(2, '0')).join(""));
                setHash(resHash);   
            })();
        }
    }

3、第三种写法（安装js-sha256），得到正确值了

import { sha256 } from 'js-sha256';  
  
const getHash = (blob: Blob) =>  
    new Promise((resolve) => {  
        const file = new FileReader();  
        file.onload = (e: ProgressEvent<FileReader>) => {  
            // @ts-ignore  
            resolve(sha256(e.target?.result));  
        };  
    file.readAsArrayBuffer(blob);  
});

可以自己搜索转换链接进行检验，如

（1）文件转hash计算网站：www.atoolbox.net/Tool.php?Id…

（2）mac系统下查看文件SHA256哈希的方法：www.feiniaomy.com/post/1029.h…