更正javascript中所有文件类型的MD5哈希

Question

在这里使用库： https : //github.com/blueimp/JavaScript-MD5我正在尝试使用javascript正确哈希MD5中的文件。

到目前为止，我得到了文本文件的正确哈希，但是如果我尝试对图像文件进行哈希，则会得到不正确的哈希。

这可能是由于javascript FileReader如何读取较大的图像文件。 我已经尝试过readAsBinaryString（），readAsArrayBuffer（）和readAsText（），但是它们都不提供给定库的正确哈希值。

我应该如何为此读取文件以为所有文件类型提供正确的哈希，是否有更合适的库适用于我应该使用的所有文件类型？

HTML：

<input id="file-to-hash" type=file>
<button onclick="hashFile()">Hash</button>

使用Javascript：

function hashFile() {

 var file = document.getElementById('file-to-hash').files[0];

 var reader = new FileReader();
 reader.readAsArrayBuffer(file);
 reader.onload = readSuccess;
}

function readSuccess(evt){
 fileContents = evt.target.result;
 var hash = md5(fileContents);
}

Answer 1

现在有SubtleCrypto API及其subtle.digest方法。

您将无法从此API获取MD5哈希，因为MD5 不再被认为是安全的 。

但是您将能够使用其他（更安全）的算法（例如SHA）获得哈希值。

 function getHash(buffer, algo = "SHA-256") { return crypto.subtle.digest(algo, buffer) .then(hash => { // here hash is an arrayBuffer, so we'll convert it to its hex version let result = ''; const view = new DataView(hash); for (let i = 0; i < hash.byteLength; i += 4) { result += ('00000000' + view.getUint32(i).toString(16)).slice(-8); } return result; }); } f.onchange = e => { const fR = new FileReader(); fR.onload = e => getHash(fR.result) .then(hash => console.log(hash)) // Chrome only accept it from an secure origin .catch(e => { if (e.code === 9) { console.log(`Be sure to be on the https page : https://stackoverflow.com/questions/44036218/`) } else { console.log(e.message) } }) fR.readAsArrayBuffer(f.files[0]); } 

 <input type="file" id="f">