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?

Ein CSP-Hash ist ein base64-kodierter SHA-256-, SHA-384- oder SHA-512-Digest des exakten Inhalts eines Inline-Skripts oder Style-Blocks. Wenn Sie den Hash zu Ihrem CSP-Header als script-src 'sha256-...' oder style-src 'sha256-...' hinzufügen, erlaubt der Browser die Ausführung dieses spezifischen Inline-Codes, während er alle anderen Inline-Skripte oder -Styles blockiert. Dies ist die sicherste Alternative zu 'unsafe-inline'.

Kurze Antwort

Verwenden Sie einen CSP-Hash, um ein bestimmtes Inline-Skript oder -Style zu erlauben, ohne allen Inline-Code mit unsafe-inline zu aktivieren. Der Hash ist ein kryptografischer Digest des exakten Code-Inhalts —SHA-256 ist der Standard. Fügen Sie den Hash zu Ihrem CSP als script-src 'sha256-...' oder style-src 'sha256-...' hinzu.

Last updated: 2026-05-28

Einschränkungen

Der Hash ist nur für den exakt gehashten Inhalt gültig. Jede Änderung von Leerzeichen, Formatierung oder Inhalt erzeugt einen vollständig anderen Hash und unterbricht die CSP-Zulassungsliste.
Einige Build-Tools und HTML-Minifizierer können Inline-Leerzeichen in der Produktion ändern, wodurch Hashes, die aus Entwicklungs-Code generiert wurden, ungültig werden. Überprüfen Sie gegen den Produktions-Output.
CSP-Hashes funktionieren nicht mit Inline-Event-Handlern (onclick, onerror) ohne Aktivierung von unsafe-hashes, was die Sicherheit erheblich schwächt.

Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub

So nutzt du dieses Tool

Kopieren Sie den exakten Inline-Skript- oder Style-Inhalt aus Ihrem HTML —jedes Leerzeichen, jeder Zeilenumbruch und jede Einr眉ckung muss übereinstimmen.
Fügen Sie ihn in das Textfeld ein und wählen Sie den Hash-Algorithmus.
Kopieren Sie den Hash-Wert und fügen Sie ihn als Teil von script-src oder style-src zu Ihrem CSP-Header oder Meta-Tag hinzu.

Wofür du es nutzen kannst

Ein bestimmtes Inline-Skript für einen Critical-Path-Loader oder Analytics-Snippet erlauben, ohne alle Inline-Skripte zu aktivieren.
Einen kleinen Inline-Style-Block für above-the-fold kritisches CSS erlauben, während ein Stylesheet geladen wird.
Ein bestehendes CSP, das unsafe-inline verwendet, auf hashbasiertes Allowlisting für stärkere Sicherheit umstellen.

Anwendungsfalle

Praxisbeispiele

Beispiel

Critical-Path-Inline-Style

Eine Seite benötigt einen kleinen Inline-Style für den Hero-Bereich above the fold. Hashen Sie den exakten Style-Block, fügen Sie style-src 'sha256-...' zum CSP hinzu und entfernen Sie unsafe-inline. Der Browser führt nur diesen spezifischen Style-Block aus.

Beispiel

Inline-Analytics-Boot-Skript

Eine datenschutzorientierte Seite lädt ein kleines Analytics-Boot-Skript inline. Hashen Sie das Skript, fügen Sie script-src 'sha256-...' hinzu und blockieren Sie alle anderen Inline-Skripte, einschliesslich solcher, die durch kompromittierte Drittanbieter-Ressourcen eingeschleust werden könnten.

Haufige Fehler

Auch nur ein einziges Leerzeichen nach der Generierung des Hashes ändern —der Hash stimmt nicht mehr überein, und das Skript oder der Style wird blockiert.
Denselben Hash für minifizierte und nicht minifizierte Versionen desselben Codes verwenden —sie produzieren unterschiedliche Hashes.
Annehmen, dass ein Hash aus einer Entwicklungsumgebung mit dem Produktions-Build übereinstimmt —Code-Minifizierung oder Templating ändert den Inhalt.

Überprüfung

Überprüfen Sie die Browserkonsole auf CSP-Verstossmeldungen nach dem Hinzufügen des Hashes —ein blockiertes Skript oder Style zeigt eine Verstossmeldung mit dem erwarteten Hash an.
Verwenden Sie den DevTools-Anwendungsbereich oder den Sicherheits-Tab des Browsers, um die aktive CSP-Richtlinie zu inspizieren und zu bestätigen, dass Ihr Hash erkannt wird.

FAQ

Fragen zu CSP Hash Generator

Warum funktioniert mein Hash nicht mehr, nachdem ich den Inline-Code bearbeitet habe?

Der Hash ist ein kryptografischer Digest der exakten Byte-Sequenz des Inline-Codes. Jede Änderung —ein Leerzeichen hinzufügen, die Einr眉ckung ändern, einen Kommentar hinzufügen oder ein einzelnes Zeichen ändern —erzeugt einen vollständig anderen Hash. Sie müssen den Hash jedes Mal neu generieren, wenn Sie den Inline-Code ändern. Dies ist beabsichtigt: Es stellt sicher, dass nur der exakte von Ihnen genehmigte Code ausgeführt werden kann.

Sollte ich einen Hash oder einen Nonce für CSP verwenden?

Hashes sind am besten für statischen Inline-Code, der sich selten ändert, wie kritisches CSS oder ein kleines Boot-Skript. Nonces sind besser für dynamisch generierten Inline-Code, da sich ein Nonce bei jedem Seitenladen ändert, während ein Hash für jede eindeutige Ausgabe neu berechnet werden müsste. Für statische Seiten sind Hashes einfacher, da sie keine serverseitige Nonce-Generierung erfordern.

Was ist unsafe-hashes und sollte ich es aktivieren?

unsafe-hashes ermöglicht die Anwendung von Hashes auf Inline-Event-Handler (onclick, onerror usw.) und javascript:-URLs. Dies ist gefährlich, da Event-Handler oft benutzerbeeinflusste Werte enthalten. Aktivieren Sie unsafe-hashes nur, wenn Sie jede Event-Handler-Eigenschaft vollständig kontrollieren und verstehen, dass ein Hash-Match bei einem Event-Handler eine Skripteinschleusung ermöglichen kann, wenn Benutzereingaben den Attributwert erreichen.

Verwandte Tools