JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/components/core.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/components/lib-typedarrays.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/components/md5.js"></script>
<script>
  var url = 'http://site.com/file.pdf';

  var xhr = new XMLHttpRequest();
  xhr.responseType = 'blob';

  xhr.onreadystatechange = function (event) {
    if (event.target.readyState == 4) {
      if (event.target.status == 200 || event.target.status == 0) {
        //Status 0 is setup when protocol is "file:///" or "ftp://"
        var blob = this.response;
        calculateMd5(blob);
      } else {
      }
    }
  };
  xhr.open('GET', url, true);
  xhr.send();

  function calculateMd5(blob) {
    var reader = new FileReader();
    reader.readAsArrayBuffer(blob);
    reader.onloadend = function () {
      var wordArray = CryptoJS.lib.WordArray.create(reader.result),
          hash = CryptoJS.MD5(wordArray).toString();
      document.write("MD5 Checksum ", hash);
    };
  }

</script>