Enter the url of the file:

MD5 hash of your file is:

So, it’s not possible to calculate MD5 hash of the remote file, because to be able to get the hash, you need to process every single byte of that file.

But with JavaScript we are able to calculate this file inside the browser without the need for user to save it to disk and than select it from the disk, which is the solution I have seen everywhere online, the reason might be the fact that most of the webpages are protected by CORS which means another webpage can’t request files hosted there. But anyway some are not protected or you might have another use-case.

The steps are easy, for calculating the hash we will be using the well-known JS library called crypto-js . And for downloading the file we will be using the fetch API which is supported by all major modern browsers.

First we need to download the file as blob which represents raw data.

function downloadAndCreateHash(){

  fetch(urlToFile)
    .then(function(response) {
      // Get it as blob
      return response.blob() // returns a promise
    })
    .then(blob => {
      // Calculate the hash from it
      return calculateMD5(blob)        
    })   
} 

Once we have the data as blob we can send it to the function to calculate the hash.

function calculateMD5(blob) {
  return new Promise((resolve) => {
    const reader = new FileReader();
    reader.readAsArrayBuffer(blob);
    reader.onloadend = function () {
      var wordArray = CryptoJS.lib.WordArray.create(reader.result),
        hash = CryptoJS.MD5(wordArray).toString().toUpperCase();
        resolve(hash)
    };
  })
}

It’s very important to threat the data as a blob. Many JS request libraries automatically transfer the data for you by default. For example into the text form, resulting in invalid hash.
We could improve our code by piping the data from fetch trough custom response stream reader and calculate the MD5 hash directly in there chunk by chunk so theoretically we wouldn’t need to store the all the data in memory before calculating the hash.

You can get the full working example here https://gist.github.com/petrvecera/778cc7eba374d54c14288bf6094311db


Leave a Reply

Your email address will not be published. Required fields are marked *