HomeGuidesHow to Calculate SHA-256 and HMAC Signatures with the Web Crypto API
Security & Cryptography6 min readUpdated 2026-11-07

How to Calculate SHA-256 and HMAC Signatures with the Web Crypto API

Generate cryptographically secure digests and webhook verification signatures in browser JavaScript without external NPM libraries.

Need to do this immediately?

Use our free, private client-side browser tool with zero installation.

Launch Cryptographic Hash & HMAC Generator
Verifying API webhook signatures (such as Stripe, GitHub, or Shopify webhook callbacks) and generating file integrity checksums traditionally relied on bulky third-party libraries like CryptoJS. Modern browsers include the native SubtleCrypto API, providing hardware-accelerated, zero-dependency cryptographic operations directly in vanilla JavaScript.

The SubtleCrypto Digest Architecture

The `window.crypto.subtle.digest('SHA-256', buffer)` method converts arbitrary ArrayBuffers into 32-byte cryptographic hashes in microseconds.

Transforming the resulting ArrayBuffer into a readable hexadecimal string requires mapping each byte with `.toString(16).padStart(2, '0')`.

Pro Tip:Always encode text strings into binary ArrayBuffers using new TextEncoder().encode(str) before passing them to SubtleCrypto.

HMAC-SHA256 Key Import and Signing

Calculating a Keyed-Hash Message Authentication Code (HMAC) requires first importing the shared secret key via `subtle.importKey('raw', keyBuffer, { name: 'HMAC', hash: 'SHA-256' }, false, ['sign'])`.

Once imported, calling `subtle.sign('HMAC', key, dataBuffer)` generates the tamper-proof signature.

Step-by-Step Tutorial

1

Encode Text to Uint8Array

Use const msgUint8 = new TextEncoder().encode('my secret payload');

2

Execute Cryptographic Digest

const hashBuffer = await crypto.subtle.digest('SHA-256', msgUint8);

3

Format Hexadecimal Output

Convert the hash buffer to a standard 64-character hex string for comparison.

Ready to Try It Yourself?

DocSwift processes everything directly on your device. Fast, safe, and completely free forever.

How helpful was this guide?

Rated 4.9 / 5 by 3,420+ users worldwide

Share with Colleagues & Friends

Help others protect their document privacy

Frequently Asked Questions

Is Web Crypto API available in Web Workers?

Yes. self.crypto.subtle is fully available inside Dedicated Web Workers and Service Workers for background hashing.

Can Web Crypto hash a 1GB file without freezing the UI?

Yes! By reading the file in chunks using FileReader or File.stream(), SubtleCrypto hashes large files smoothly in background threads.