SRI Hash Generator

Quick Solution

To generate an SRI hash via the command line, use OpenSSL: openssl dgst -sha384 -binary script.js | openssl base64 -A. Then, add the output to your HTML tag: <script src="script.js" integrity="sha384-[YOUR_HASH]" crossorigin="anonymous"></script>.

When Should I Use This?

Use the SRI hash generator to protect your website from compromised third-party CDNs and supply chain attacks.

• Loading popular libraries like React, jQuery, or Bootstrap from public CDNs safely.
• Complying with strict Content Security Policy (CSP) requirements that mandate Subresource Integrity for all external scripts.
• Ensuring that third-party analytics or tracking scripts cannot be maliciously modified to inject malware into your site.

Deep Dive: Subresource Integrity (SRI) & Supply Chain Defense

Modern web application architectures depend on geographically distributed Content Delivery Networks (CDNs), edge caching layers, and third-party vendor repositories to serve vendor libraries like React, Tailwind, jQuery, and analytics frameworks. However, loading external Javascript and stylesheet files directly into an application's execution context creates a severe surface area for **software supply chain attacks**. If an attacker breaches a CDN origin, hijacks a DNS routing table, or compromises a vendor asset repository, they can silently inject malicious keystroke loggers, credential stealers, or cryptomined payloads directly into thousands of dependent applications simultaneously without altering your domain servers.

**Subresource Integrity (SRI)** is a W3C web standard designed to eliminate third-party code manipulation vulnerabilities. By appending a cryptographic checksum directly to your HTML application shell via the integrity attribute, you establish a mathematical contract of trust with the end user's browser. When the client attempts to download an external file, the browser calculates the cryptographic hash of the received stream in memory prior to execution. If the computed digest diverges from your defined hash by even a single bit, the browser instantly rejects the script, throws a network error, and insulates your users from compromise.

CLI Automation & Build Pipeline Integration

While web-based SRI generation utilities are indispensable for debugging single script insertions or reviewing vendor updates, modern DevSecOps practices mandate automating integrity calculation inside Continuous Integration (CI/CD) pipelines. Implementing automated bash, OpenSSL, or Node.js scripts prevents developers from manually pasting outdated script hashes when releasing production build artifacts.

# Calculate SRI hash from a local static bundle file:
openssl dgst -sha384 -binary dist/bundle.min.js | openssl base64 -A | awk '{print "sha384-"$0}'

# Fetch remote CDN file directly and calculate its SRI integrity string:
curl -s https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css | openssl dgst -sha384 -binary | openssl base64 -A | sed 's/^/integrity="sha384-/;s/$/"/'

import { createHash } from 'node:crypto';
import { readFileSync, writeFileSync } from 'node:fs';

function generateSRI(filePath, algorithm = 'sha384') {
  const fileBuffer = readFileSync(filePath);
  const hash = createHash(algorithm).update(fileBuffer).digest('base64');
  return `${algorithm}-${hash}`;
}

const targetFile = './dist/app.bundle.js';
const sriDigest = generateSRI(targetFile, 'sha384');
console.log(`[Build Success] Calculated SRI for ${targetFile}: ${sriDigest}`);
// Inject directly into HTML templates:
// <script src="app.bundle.js" integrity="${sriDigest}" crossorigin="anonymous"></script>

Troubleshooting SRI Verification Failures

When an integrity verification check fails, web browsers terminate asset evaluation instantly to shield users from unauthorized instructions. Below are explicit diagnostic resolutions for the most frequent runtime errors encountered when implementing Subresource Integrity in production web architectures.