Verify Passwords Against SHA Hashes Verify passwords against SHA hash digests.

The tool works by using the Web Crypto API's subtle.digest() function to compute the hash of a given password. This function takes two parameters: the algorithm to use and the data to be hashed. In this case, it uses algorithms like SHA-1, SHA-256, SHA-384, and SHA-512, which are selected via buttons on the interface. The input password is first encoded into UTF-8 format using a TextEncoder, resulting in an array of bytes that can be processed by subtle.digest().

The output of subtle.digest() is a promise that resolves to an ArrayBuffer containing the hashed data. This ArrayBuffer is then converted to a Uint8Array and mapped over to create an array of hexadecimal strings, where each byte is represented as a two-digit hex value padded with zeros if necessary. The resulting array of hex strings is joined together into a single string representing the hash in lowercase hexadecimal format.

When comparing this computed hash to the provided expected hash, it trims any whitespace from the expected hash and performs a case-insensitive comparison by converting both hashes to lowercase using the toLowerCase() method. This allows for accurate verification even if the user enters their password or hash with varying cases. For example, when verifying against an SHA-256 hash, which produces 64 hexadecimal characters, it ensures that every character matches exactly in order to return a match result.

Internally, React state management is used to store and update variables such as the input password, expected hash, selected algorithm, and verification result. The useState hook initializes these states with default values, while the useCallback hook memoizes the verify function so it's recreated only when its dependencies change. This ensures efficient handling of user interactions without causing unnecessary re-renders or computations.

As a client-side application built using React, TypeScript, and Web Crypto API, all password processing happens within the browser itself. Technologies like crypto.subtle.digest() enable secure cryptographic operations directly in the client's web environment, eliminating the need to transmit sensitive information over networks for verification purposes.