Create SHA3-512 Hash in JavaScript

Stepping into the realm of cybersecurity, I’ve often found myself intrigued by the various cryptographic hash functions, particularly SHA3-512, and its applications in Javascript. Today, I invite you on a journey to demystify this powerful yet underrated tool. Together, we’ll delve into the process of creating a SHA3-512 hash in Javascript, a useful technique that can be a real game-changer in enhancing your data security practices. There are weaker predecessors to SHA3 like MD5, SHA1, SHA2. Interested in knowing the difference between SHA1, SHA2 & SHA3, this will give you a great insight on how SHA has evolved over the years.

Encryption and hashing have served as the foundation for new security modules, among other network security developments. One of the most used hash algorithms is the Secure Hash Algorithm(SHA) with a digest size of 512 bits, or SHA 512. Although there are numerous variations, SHA 512 has been the most often used in practical applications.

Introduction to SHA3-512 Hashing

SHA-3 (Secure Hash Algorithm 3) is the latest member of the Secure Hash Algorithm family of standards. Although part of the same series of standards, SHA-3 is internally different from the MD5-like structure of SHA-1 and SHA-2. SHA-3 instances are drop-in replacements for SHA-2, intended to have identical security properties. The SHA-3 family consists of six hash functions with digests (hash values) that are 128, 224, 256, 384 or 512 bits: SHA3-224, SHA3-256, SHA3-384, SHA3-512, SHAKE128, SHAKE256.

The SHA-3 or Keccak algorithm is one of the most secure and efficient hashing algorithms and some claim that it won’t be cracked in the next 20 – 30 years. Developments in the quantum computing world might decrease that time frame but it is still one of the best hashing algorithm we have got right now.

The hash function generates the same output hash for the same input string. This means that, you can use this string to validate files or text or anything when you pass it across the network or even otherwise. SHA3-512 can act as a stamp or for checking if the data is valid or not.

The 512 in the name SHA3-512 refers to the final hash digest value, meaning that regardless of the amount of plaintext or cleartext, the hash value will always be 512 bits.

For example –

Input String	Output Hash
hi	154013cb8140c753f0ac358da6110fe237481b26c75c3ddc1b59eaf9dd7b46a0a3aeb2cef164b3c82d65b38a4e26ea9930b7b2cb3c01da4ba331c95e62ccb9c3
debugpointer	ac09d8e98cd7d60927600334167ca22a79fad316a8af4fdc1d076c6cfe72c44778cc47223eb296f3ddc13dcfd4bb395f6346c0f29f2f2f4a46f4d9bcee63d1df
computer science is amazing! I love it.	308a9fd755db73031ddae5f58734c8b57db3bc5ea24bfc6de7df962158e24bbe697219a72ccdeaa03c1848f2c35ef46d050ec0b678465de309e8a43bdf248c64

SHA3-512 Hash for Strings

The methods below are for creating it at client-side or browser. If you are looking to generate SHA3-512 checksum in nodejs, please follow this article – Create SHA3-512 Hash in Node.js and you can also create SHA3-256 Hash of a file.

Method 1 – Using cryptography-js SHA3-512 hash in HTML code

Here we will be using the above npm package directly in HTML code. We are using version 4.1.1 of the cryptography-js package. Let’s use the Cloudflare CDN links and use <script> tags to import core.min.js and sha3.js scripts.

After that, you can use it in your code as cryptographyJS.SHA3(yourString, { outputLength: hashLength }). Here is an example demonstrating cryptography-js and SHA3-512 implementation-

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>SHA3-512</title>
  </head>
  <body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/cryptography-js/4.1.1/core.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/cryptography-js/4.1.1/sha3.js"></script>
    <script>
      var hash = cryptographyJS.SHA3("This works", { outputLength: 512 });
      console.log(hash);
      console.log(hash);
    </script>
  </body>
</html>

The output of the above code as an alert and in the logs will be-

d847a8a72496900d82e8f6ef89587f4cef974c6220a38ac2dc715753d36a3e8b0020603f4bb0c8c2072383c3cb83735e06481a0a618b0bfb733f72a5c8a81ff5

Creating SHA3-512 hash of password in Javascript

You can create SHA3-512 hash of a password in the front-end JavaScript by passing the password variable to the SHA3 function of cryptographyJS by passing outputLength with value 512 i.e., cryptographyJS.SHA3(password, { outputLength: 512 }).

You might be looking for the nodejs implementation of SHA3-512 hash using the cryptography library.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>SHA3 256</title>
  </head>
  <body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/cryptography-js/4.1.1/core.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/cryptography-js/4.1.1/sha3.js"></script>
    <script>
      var password = "Hello@123";
      var passhash = cryptographyJS.SHA3(password, { outputLength: 512 });
      console.log(passhash);
    </script>
  </body>
</html>

The output of the above script will be an SHA3-512 hash of password when you open the file in the browser-

dcda1dde9fb10da7fd41ef1565bd4080eb4abe848759842c8133bae138b8b9922ac6dc2c6dc118b0410d795999f486f1642a0c3215768fbc03f8115770bdd82d

Method 2 : Using cryptography-js SHA3 hash using ES6 and require

Let’s get into the modern approach first, using ES6 and cryptography-js module in the frontend. Here, can import the function SHA3-512 from the package. You can then use it directly to create an SHA3-512 hash as shown in the example below-

First install the npm package-

$ bower install cryptography-js

Let’s configure it in require-

require.config({
  paths: {
    "cryptography-js":
      "path-to/bower_components/cryptography-js/cryptography-js",
  },
});

Then you can use it in your code-

require(["cryptography-js"], function (cryptographyJS) {
  console.log(cryptographyJS.SHA3("Hello All", { outputLength: 512 }));
});

The output of the above code in the console will be-

91e5b904edbe7b69dd17790302b34728ce8d9d9e64dac94ab86252f63f2d8dcecd500d47e286c6300b7977c192973f6d53e739c79dc731ac83856961db849b59

It’s your choice, use what works best for you.

Prefer SHA3-256 or SHA3-512 or other superior cryptographic hash functions for creating a hash for passwords, integrity verification.

I’m glad that you found the content useful. So there we have it! You and I, we’ve taken the path less traveled and unraveled the intricacies of creating a SHA3-512 hash in Javascript. I believe that this knowledge will equip you to better secure your digital resources and further your understanding of cryptographic hash functions. As we bid adieu, remember that in this vast field of cryptographic, there is always more to learn and explore. Don’t stop here – the road to mastering cryptography is long but thrilling. Happy Coding.

Subscribe to Updates

What's Hot