Content Security Policy erstellen

Generieren Sie CSP-Header interaktiv mit allen Direktiven, Presets und Ausgabe für HTTP-Header, Meta-Tags, Nginx, Apache und Express.

Erstellen und konfigurieren Sie Content Security Policy (CSP)-Header visuell mit einem interaktiven Direktiven-Editor. Fügen Sie Quellen pro Direktive hinzu, sehen Sie Ihre Richtlinie live in der Vorschau und exportieren Sie als HTTP-Header, HTML-Meta-Tags oder Nginx-, Apache- oder Express.js-Konfigurationen. Alles wird in Ihrem Browser verarbeitet.

Loading...
Deine Daten bleiben in deinem Browser
War dieses Tool hilfreich?
Anleitung

So Erstellen Sie einen CSP-Header

1
1

Direktiven Wählen

Beginnen Sie mit default-src und fügen Sie weitere Direktiven wie script-src, style-src oder img-src für granulare Kontrolle hinzu.

2
2

Erlaubte Quellen Hinzufügen

Klicken Sie auf voreingestellte Werte wie 'self' oder 'none', oder geben Sie benutzerdefinierte Domains ein um bestimmte Ursprünge freizugeben.

3
3

Richtlinie Exportieren

Wechseln Sie zwischen Ausgabe-Tabs um den CSP als HTTP-Header, Meta-Tag oder Server-Konfigurationsausschnitt zu kopieren.

Guide

Vollständiger Leitfaden zu Content Security Policy

Warum CSP für Web-Sicherheit Wichtig Ist

Content Security Policy ist eine der effektivsten Verteidigungen gegen Cross-Site-Scripting (XSS)-Angriffe. Indem Sie genau deklarieren, welche Quellen Skripte, Styles, Bilder und andere Ressourcen laden dürfen, erstellen Sie eine Whitelist, die Browser automatisch durchsetzen. Selbst wenn ein Angreifer bösartigen Code in Ihre Seite injiziert, weigert sich der Browser, ihn auszuführen.

CSP-Direktiven Verstehen

Jede Direktive kontrolliert einen bestimmten Ressourcentyp. Die default-src-Direktive dient als Fallback für jeden nicht spezifizierten Typ. Die script-src-Direktive regelt JavaScript-Quellen, style-src behandelt CSS und img-src kontrolliert Bilder. Speziellere Direktiven wie connect-src beschränken fetch und XMLHttpRequest, während frame-ancestors bestimmt, welche Seiten Ihre einbetten dürfen.

Gängige Quellwerte Erklärt

Der Wert 'self' erlaubt Inhalte vom eigenen Ursprung. Der Wert 'none' blockiert alles für diese Direktive. Für Inline-Skripte erlaubt 'unsafe-inline' diese, schwächt aber die Sicherheit; bevorzugen Sie Nonce-basierte oder Hash-basierte Ansätze. Der Wert 'strict-dynamic' vertraut Skripten, die von bereits vertrauenswürdigen Skripten geladen werden, und vereinfacht die CDN-Nutzung.

CSP in Produktion Bereitstellen

Beginnen Sie mit Content-Security-Policy-Report-Only um Verstoßberichte zu sammeln ohne Funktionalität zu beeinträchtigen. Analysieren Sie die Berichte, passen Sie Ihre Richtlinie an und wechseln Sie dann zum erzwingenden Header. Verwenden Sie report-uri oder report-to-Direktiven um Verstöße an einen Logging-Endpunkt zu senden. Überwachen Sie regelmäßig, da neue Integrationen unerwartete Blockierungen verursachen können.

Examples

CSP-Konfigurationsbeispiele

Einfache Sichere Website

Eine Website, die nur eigene Ressourcen ladt und Google Fonts verwendet.

1

default-src auf 'self' setzen

2

font-src auf 'self' fonts.gstatic.com setzen

3

style-src auf 'self' fonts.googleapis.com setzen

default-src 'self'; font-src 'self' fonts.gstatic.com; style-src 'self' fonts.googleapis.com

E-Commerce mit Analytics

Ein Online-Shop mit Google Analytics, Stripe-Zahlungen und einem CDN für Bilder.

1

default-src auf 'self' setzen

2

script-src auf 'self' www.googletagmanager.com js.stripe.com setzen

3

connect-src auf 'self' www.google-analytics.com api.stripe.com setzen

4

img-src auf 'self' cdn.example.com data: setzen

5

frame-src auf js.stripe.com setzen

default-src 'self'; script-src 'self' www.googletagmanager.com js.stripe.com; connect-src 'self' www.google-analytics.com api.stripe.com; img-src 'self' cdn.example.com data:; frame-src js.stripe.com

Anwendungsfälle

CSP-Anwendungsfälle

Gemischten Inhalt Blockieren

Setzen Sie default-src auf 'self' und upgrade-insecure-requests um HTTPS für alle Ressourcen zu erzwingen. Dies verhindert, dass Browser HTTP-Assets auf HTTPS-Seiten laden, eliminiert Warnungen zu gemischtem Inhalt und verbessert die Sicherheitslage.

Drittanbieter-Skripte Einschränken

Konfigurieren Sie script-src so, dass nur 'self' und bestimmte CDN-Domains wie cdn.jsdelivr.net erlaubt sind. Dies blockiert Inline-Skripte und unbekannten Drittanbieter-Code und reduziert die Angriffsfläche für Cross-Site-Scripting-Schwachstellen erheblich.

Iframes Sperren

Verwenden Sie frame-ancestors 'none' um zu verhindern, dass Ihre Website in Iframes auf anderen Domains eingebettet wird. Dies bietet Clickjacking-Schutz ähnlich wie X-Frame-Options DENY, aber mit mehr Flexibilität für das Whitelisting vertrauenswürdiger Eltern.

Häufig Gestellte Fragen

?Was ist eine Content Security Policy?

CSP ist ein HTTP-Header, der Browsern mitteilt, welche Inhaltsquellen auf Ihrer Seite erlaubt sind und XSS- sowie Dateninjektionsangriffe verhindert.

?Was kontrolliert default-src?

Es dient als Fallback für alle Ressourcentypen. Wenn eine spezifische Direktive wie script-src nicht gesetzt ist, verwendet der Browser stattdessen default-src.

?Sollte ich 'unsafe-inline' in script-src verwenden?

Vermeiden Sie es wenn möglich, da es Inline-Skripte erlaubt und den XSS-Schutz schwächt. Verwenden Sie Nonces oder Hashes als sicherere Alternativen.

?Kann ich meine CSP vor dem Deployment testen?

Ja. Verwenden Sie zuerst den Content-Security-Policy-Report-Only-Header. Er protokolliert Verstöße ohne Ressourcen zu blockieren und ermöglicht sichere Feinabstimmung.

?Was ist der Unterschied zwischen HTTP-Header und Meta-Tag?

Beide liefern dieselbe Richtlinie. Der HTTP-Header ist bevorzugt, da Meta-Tags die Direktiven frame-ancestors und report-uri nicht unterstützen.

?Sind meine Daten privat?

Ja. Alles läuft lokal in Ihrem Browser. Keine Daten werden an einen Server gesendet. Ihre CSP-Konfiguration verlässt niemals Ihren Rechner.

?Ist dieses Tool kostenlos?

Ja. Völlig kostenlos ohne Limits und ohne Registrierung. Erstellen Sie so viele Richtlinien wie Sie brauchen ohne jegliche Einschränkungen.

Hilf uns besser zu werden

Wie gefällt Ihnen dieses Tool?

Jedes Tool bei Kitmul wird auf Basis echter Nutzeranfragen gebaut. Ihre Bewertung und Ihre Vorschläge helfen uns, Bugs zu beheben, fehlende Funktionen hinzuzufügen und die Tools zu bauen, die Sie wirklich brauchen.

Dieses Tool bewerten

Tippen Sie auf einen Stern, um uns zu sagen, wie nützlich dieses Tool für Sie war.

Vorschlag machen oder Bug melden

Eine Funktion fehlt? Einen Bug gefunden? Haben Sie eine Idee? Sagen Sie es uns und wir schauen es uns an.

Ähnliche Tools

Empfohlene Lektüre

Empfohlene Bücher über Web-Sicherheit und CSP

Als Amazon-Partner verdienen wir an qualifizierten Verkäufen.

Erweitern Sie Ihre Fähigkeiten

Sicherheitstools für Webentwickler

Als Amazon-Partner verdienen wir an qualifizierten Verkäufen.

Newsletter

Erhalte Produktivitätstipps und Neue Tools Zuerst

Schließe dich Machern und Entwicklern an, die Datenschutz schätzen. Jede Ausgabe: neue Tools, Produktivitäts-Hacks und Updates — kein Spam.

Prioritätszugang zu neuen Tools
Jederzeit abbestellen, ohne Rückfragen