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

Question

Using the library here: https://github.com/blueimp/JavaScript-MD5 I am attempting to correctly hash files in MD5 using javascript.

So far I get correct hashes for text files but if I attempt to hash an image file I get an incorrect hash.

This could be due to how the javascript FileReader reads the larger image files. I have tried readAsBinaryString(), readAsArrayBuffer() and readAsText() none of which provide the correct hash with the given library.

How should I be reading the file for this to provide a correct hash for all filetypes, is there a more appropriate library that works for all filetypes I should be using?

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

There is now the SubtleCrypto API and its subtle.digest method.

You won't be able to get an MD5 hash from this API, because MD5 is not considered secure anymore .

But you'll be able to get an hash with other (more-secure) algorithms, such as 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">