jquery.app
Deutsch
EnglishDeutschFrancaisEspanol日本語Nederlands

HTML-Tools

Kostenlose CSP Hash Generator

Erstelle CSP-Hash-Werte für Inline-Skripte und -Styles. Hashe exakten Code mit SHA-256, SHA-384 oder SHA-512.

Tool wird geladen...

Was ist CSP Hash Generator?

A CSP hash is a base64-encoded SHA-256, SHA-384, or SHA-512 digest of an inline script or style block's exact content. When you add the hash to your CSP header as script-src 'sha256-...' or style-src 'sha256-...', the browser allows that specific inline code to run while blocking all other inline scripts or styles. This is the most secure alternative to 'unsafe-inline'.

Kurze Antwort

Use a CSP hash to allow a specific inline script or style without enabling all inline code with unsafe-inline. The hash is a cryptographic digest of the exact code content — SHA-256 is the standard. Add the hash to your CSP as script-src 'sha256-...' or style-src 'sha256-...'.

Einschränkungen

  • The hash is only valid for the exact content hashed. Any whitespace, formatting, or content change produces a completely different hash and breaks the CSP allowlist.
  • Some build tools and HTML minifiers may modify inline whitespace in production, invalidating hashes generated from development code. Verify against production output.
  • CSP hashes do not work with inline event handlers (onclick, onerror) without enabling unsafe-hashes, which weakens security significantly.

So nutzt du dieses Tool

  1. Copy the exact inline script or style content from your HTML — every space, newline, and indent must match.
  2. Paste it into the text area and select the hash algorithm.
  3. Copy the hash value and add it to your CSP header or meta tag as part of script-src or style-src.

Wofür du es nutzen kannst

  • Allow a specific inline script for a critical-path loader or analytics snippet without enabling all inline scripts.
  • Allow a small inline style block for above-the-fold critical CSS while a stylesheet loads.
  • Upgrade an existing CSP that uses unsafe-inline to hash-based allowlisting for stronger security.

Anwendungsfalle

Praxisbeispiele

Beispiel

Critical-path inline style

A page needs a small inline style for the hero section above the fold. Hash the exact style block, add style-src 'sha256-...' to the CSP, and remove unsafe-inline. The browser runs only this specific style block.

Beispiel

Inline analytics boot script

A privacy-focused site inline-loads a small analytics boot script. Hash the script, add script-src 'sha256-...', and block all other inline scripts including any that might be injected by compromised third-party resources.

Haufige Fehler

  • Changing even one whitespace character after generating the hash — the hash will no longer match and the script or style is blocked.
  • Using the same hash for minified and unminified versions of the same code — they produce different hashes.
  • Assuming a hash from a development environment matches the production build — code minification or templating changes the content.

Überprüfung

  1. Check the browser console for CSP violation reports after adding the hash — a blocked script or style shows a violation message with the expected hash.
  2. Use the browser DevTools Application panel or Security tab to inspect the active CSP policy and confirm your hash is recognized.

FAQ

Fragen zu CSP Hash Generator

Why does my hash stop working after I edit the inline code?

The hash is a cryptographic digest of the exact byte sequence of the inline code. Any change — adding a space, changing indentation, adding a comment, or modifying a single character — produces a completely different hash. You must regenerate the hash every time you modify the inline code. This is by design: it ensures only the exact code you approved can run.

Should I use a hash or a nonce for CSP?

Hashes are best for static inline code that rarely changes, like critical CSS or a small boot script. Nonces are better for dynamically generated inline code because a nonce changes on every page load, while a hash would need to be recomputed for every unique output. For static sites, hashes are simpler because they do not require server-side nonce generation.

What is unsafe-hashes and should I enable it?

unsafe-hashes allows hashes to be applied to inline event handlers (onclick, onerror, etc.) and javascript: URLs. This is dangerous because event handlers often contain user-influenced values. Only enable unsafe-hashes if you fully control every event handler attribute and understand that a hash match on an event handler can enable script injection if user input reaches the attribute value.

Verwandte Tools

Weitere html-tools

Auch ausprobieren

Auch ausprobieren