Content-Security-Policy-Builder

Erstellen Sie CSP-Header visuell mit Vorlagen, Steuerungen pro Direktive, Validierungswarnungen, Strenge-Bewertung und Report-Only-Modus.

Aktualisiert am

Share:
Home/Website Tools/Content Security Policy Builder

Content Security Policy Builder

Visually build Content Security Policy headers with preset templates, per-directive controls, validation warnings, and strictness scoring.

Preset Templates

Use Content-Security-Policy-Report-Only header (monitors violations without enforcing)

Strictness Score
0/100
Weak

0 directives enabled

Directives

Häufig gestellte Fragen

Was ist CSP?

Ein HTTP-Header, der steuert, welche Ressourcen ein Browser laden darf, und damit XSS- und Dateninjektionsangriffe verhindert.

Erzwungen vs. nur Bericht?

Der erzwungene Modus blockiert Verstöße. Der Nur-Bericht-Modus erlaubt sie, meldet sie aber – nützlich zum Testen vor der Durchsetzung.

Warum unsafe-inline/eval vermeiden?

unsafe-inline erlaubt ausnutzbare Inline-Skripte. unsafe-eval ermöglicht die dynamische Codeausführung. Beides schwächt den CSP-Schutz erheblich.

Ist der Content Security Policy Builder kostenlos nutzbar?

Ja, der Content Security Policy Builder ist zu 100 % kostenlos – ohne Registrierung, ohne versteckte Gebühren und ohne Nutzungsbeschränkungen. Die gesamte Verarbeitung erfolgt lokal in deinem Browser und gewährleistet vollständige Privatsphäre.

Funktioniert der Content Security Policy Builder auf Mobilgeräten?

Ja, der Content Security Policy Builder ist vollständig responsiv und funktioniert auf Smartphones und Tablets. Du kannst ihn auf jedem Gerät mit einem modernen Webbrowser nutzen – ohne App-Download.

Muss ich ein Konto erstellen, um dieses Tool zu nutzen?

Es ist kein Konto und keine Registrierung erforderlich. Öffne einfach den Content Security Policy Builder in deinem Browser und beginne sofort mit der Nutzung. Es gibt keine Anmeldeschranken oder Nutzungsbeschränkungen.

Wie verwende ich den Content Security Policy Builder?

Gib einfach deine Daten in das vorgesehene Feld ein, passe die Einstellungen nach Belieben an, und das Tool verarbeitet sie sofort. Anschließend kannst du das Ergebnis in die Zwischenablage kopieren oder herunterladen.

Welche Browser werden unterstützt?

Der Content Security Policy Builder funktioniert in allen modernen Browsern, darunter Chrome, Firefox, Safari, Edge und Opera. Für das beste Erlebnis verwende die neueste Version deines bevorzugten Browsers.

Was ist der Unterschied zwischen default-src und script-src in einer CSP?

default-src ist die Fallback-Direktive: Sie legt die erlaubten Quellen für jeden Ressourcentyp fest, den du nicht explizit konfiguriert hast — sperrst du sie auf 'none' oder 'self', entsteht eine Deny-by-Default-Basis. script-src ist eine spezifische Überschreibung, die nur festlegt, woher JavaScript geladen werden darf, und hat für Skripte Vorrang vor default-src. Da Skripte der Hauptangriffsvektor für Cross-Site-Scripting sind, willst du fast immer eine strikte script-src, selbst wenn default-src bereits restriktiv ist — zum Beispiel default-src 'self' kombiniert mit einer separaten script-src 'self', die zusätzlich eine Nonce ergänzt. Andere ressourcenspezifische Direktiven wie style-src, img-src und connect-src funktionieren nach demselben Prinzip: Sie grenzen jeweils einen Ressourcentyp ein, während default-src den Rest abdeckt. Mit diesem Builder setzt du default-src einmal und überschreibst einzelne Direktiven nur dort, wo es nötig ist.

Wie füge ich einen CSP-Header in Nginx oder Apache hinzu?

In Nginx fügst du die Policy innerhalb eines server- oder location-Blocks mit add_header Content-Security-Policy "deine Policy hier" always hinzu; das always-Flag stellt sicher, dass der Header auch bei Fehlerantworten wie 404s gesendet wird. In Apache verwendest du Header set Content-Security-Policy "deine Policy hier" innerhalb des passenden VirtualHost oder in der .htaccess, wobei mod_headers aktiviert sein muss. In beiden Fällen ist der Wert der vollständige Direktiven-String, und du lädst den Server neu, damit die Änderung wirksam wird. Die Syntax von Hand exakt hinzubekommen ist fehleranfällig, deshalb generiert dieser Builder fertige Copy-paste-Snippets für Nginx, Apache, Express.js und Next.js aus der Policy, die du konfigurierst. Stelle deine Direktiven visuell zusammen, wähle deinen Server aus und füge den generierten Block direkt in deine Konfiguration ein.

Warum kann ich frame-ancestors oder report-uri nicht in einem Meta-Tag-CSP verwenden?

Eine CSP lässt sich auf zwei Wegen ausliefern: als Content-Security-Policy-HTTP-Response-Header oder als HTML-<meta http-equiv="Content-Security-Policy">-Tag im Seiten-Head. Die Meta-Tag-Methode ist praktisch, wenn du die Serverkonfiguration nicht bearbeiten kannst, aber die Spezifikation ignoriert bestimmte Direktiven in diesem Kontext bewusst. frame-ancestors, report-uri, report-to und sandbox funktionieren nur, wenn sie als echter HTTP-Header gesendet werden, weil sie bereits vor dem Rendern der Seite bekannt sein müssen oder sich auf Reporting auf Response-Ebene beziehen. Ist dir Schutz vor Clickjacking wichtig, muss frame-ancestors aus dem Header kommen, nicht aus dem Meta-Tag. Dieser Builder lässt dich zwischen Header- und Meta-Ausgabeformat wechseln und warnt dich, welche Direktiven im Meta-Modus wegfallen, damit du keine Policy ausrollst, die stillschweigend ihren Anti-Clickjacking-Schutz verliert.

Wie funktioniert der Strictness Score und was macht eine CSP strenger?

Bei jeder Änderung wird ein Strictness Score von bis zu 100 Punkten neu berechnet, gestaffelt in Weak, Fair, Good oder Excellent. Der Score belohnt echte Schutzentscheidungen und nicht nur das bloße Vorhandensein einer Policy. Die meisten Punkte gibt es für eine restriktive default-src ('none' schlägt 'self'), eine script-src ohne unsafe-inline oder unsafe-eval, object-src 'none' und eine definierte frame-ancestors. Zusätzliche Direktiven wie base-uri, form-action, eine saubere style-src und weitere einschränkende Regeln schieben den Wert weiter nach oben, während Wildcard-Quellen und die unsicheren Schlüsselwörter ihn drücken. Der Report-Only-Modus senkt den Score leicht, da ein Report-Only-Header bis zur Durchsetzung keinen echten Blockierschutz bietet. Der Analysis-Tab listet genau auf, was deinen Score bestimmt, damit du siehst, welche Schwachstellen dich von Good zu Excellent bringen.

Was ist eine Nonce oder ein Hash in einer CSP, und wann sollte ich sie statt unsafe-inline verwenden?

Eine Nonce ist ein zufälliges Token, das dein Server bei jedem Seitenaufruf neu generiert und sowohl in die CSP als auch in jedes vertrauenswürdige <script>-Tag einträgt; der Browser führt nur Skripte mit der passenden Nonce aus. Ein Hash funktioniert ähnlich, identifiziert aber ein bestimmtes Inline-Skript anhand seines sha256-Fingerabdrucks, ganz ohne Token pro Anfrage. Beide erlauben es dir, notwendige Inline-Skripte beizubehalten und gleichzeitig 'unsafe-inline' zu entfernen, das andernfalls jedes eingeschleuste Inline-Skript ausführen und deinen XSS-Schutz aushebeln würde. Kombinierst du eine Nonce zusätzlich mit 'strict-dynamic', können vertrauenswürdige Skripte auch ihre eigenen Abhängigkeiten laden, ohne dass du jede einzelne Domain auf die Whitelist setzen musst. Dieser Builder enthält Platzhalter-Quellwerte für Nonce und sha256 und empfiehlt, von unsafe-inline auf einen Nonce- oder Hash-basierten Ansatz umzusteigen. Konfiguriere script-src hier mit einem Nonce-Platzhalter und verdrahte anschließend das echte Token auf deinem Server.

Über den Content Security Policy Builder

Der Content Security Policy Builder macht aus einem notorisch fummeligen Sicherheits-Header eine Point-and-Click-Angelegenheit. Statt einen langen Content-Security-Policy-String von Hand zu schreiben und zu hoffen, dass die Syntax stimmt, hakst du einfach die benötigten Direktiven ab, wählst ihre erlaubten Quellen aus, und das Tool setzt daraus in Echtzeit eine gültige Policy zusammen. Er richtet sich an Entwickler, Website-Betreiber und sicherheitsbewusste Teams, die Schutz vor XSS und Injection wollen, ohne die komplette CSP-Spezifikation auswendig zu lernen.

Eine Content Security Policy ist ein HTTP-Response-Header, der dem Browser genau mitteilt, welche Ursprünge (Origins) Skripte, Styles, Bilder, Schriften, Frames und andere Ressourcen laden dürfen. Versucht eine Seite, etwas zu laden, das die Policy nicht erlaubt, blockiert der Browser es. Allein dieser Mechanismus stoppt die meisten Cross-Site-Scripting-Angriffe (XSS), verhindert unautorisierte Datenabflüsse und schützt über frame-ancestors zusätzlich vor Clickjacking.

Policy Direktive für Direktive aufbauen

Der Builder stellt 15 Standard-Fetch- und Navigations-Direktiven bereit, darunter default-src, script-src, style-src, img-src, connect-src, frame-ancestors, base-uri, form-action und worker-src. Aktiviere eine Direktive und weise ihr Quellwerte aus einer kuratierten Liste zu: Schlüsselwörter wie 'self', 'none', 'strict-dynamic', Platzhalter für Nonces und sha256-Hashes sowie Schema-Quellen wie https:, data: und blob:. Du kannst außerdem eigene Domains hinzufügen (etwa https://cdn.example.com oder *.example.com), um dein CDN, deine Analytics-Lösung oder eingebettete Medienanbieter auf die Whitelist zu setzen.

Wer nicht bei null anfangen möchte, kann auf sechs vorgefertigte Vorlagen zurückgreifen, die sinnvolle Konfigurationen vorausfüllen:

  • Basic Secure — eine auf 'self' basierende Policy, die die gängigen Direktiven abdeckt
  • Strict — sperrt default-src auf 'none' und erlaubt explizit nur das Nötigste
  • Permissive — ein lockerer Einstieg für Legacy-Seiten mit noch viel Inline-Code
  • WordPress — berücksichtigt Inline-Skripte, Google Fonts und YouTube-/Vimeo-Embeds
  • Next.js — deckt die Inline- und Eval-Anforderungen des Frameworks ab
  • SPA (React/Vue) — abgestimmt auf Single-Page-Apps und Blob-Worker

Policy bewerten und Schwachstellen aufspüren

Jede Änderung aktualisiert einen Strictness Score von bis zu 100 Punkten, gestaffelt von Weak über Fair und Good bis Excellent. Der Score belohnt echte Schutzentscheidungen — eine restriktive default-src, eine script-src ohne unsichere Schlüsselwörter, object-src 'none' und eine definierte frame-ancestors — und der Analysis-Tab schlüsselt genau auf, was den Wert treibt.

Zwei gefährliche Quellen werden sofort markiert. 'unsafe-inline' erlaubt ausnutzbare Inline-Skripte und ist der mit Abstand häufigste Grund, warum eine CSP XSS nicht stoppt; 'unsafe-eval' erlaubt eval() und andere dynamische Codeausführung. Der Builder kennzeichnet beide mit Warnhinweisen und schlägt sicherere Alternativen auf Basis von Nonces oder Hashes vor. Auch fehlende Schutz-Direktiven wie base-uri und form-action werden als Empfehlung angezeigt.

Sicher testen, dann auf jedem Server ausliefern

CSP kann eine Website lahmlegen, wenn eine legitime Ressource blockiert wird — deshalb bietet der Builder einen Report-Only-Modus. Dieser sendet den Header Content-Security-Policy-Report-Only, der Verstöße an einen optionalen Reporting-Endpunkt meldet, ohne tatsächlich etwas zu blockieren — der empfohlene Weg, eine Policy in Produktion zu validieren, bevor sie scharf geschaltet wird. Zu beachten: Das senkt den Strictness Score leicht, da ein Report-Only-Header bis zur Durchsetzung keinen echten Schutz bietet.

Ist die Policy fertig, kopierst du sie als rohen HTTP-Header oder als HTML-<meta http-equiv>-Tag (das Tool weist darauf hin, dass sich frame-ancestors, report-uri und sandbox nicht per Meta-Tag setzen lassen). Fertige Snippets werden für Nginx, Apache, Express.js und Next.js generiert, und das Ergebnis lässt sich auch als Datei herunterladen.

Alles läuft vollständig im Browser. Keine Policy, Domain oder Konfiguration wird an einen Server gesendet, es ist keine Anmeldung nötig, und der Content Security Policy Builder funktioniert auf jedem modernen Browser, mobile Geräte eingeschlossen.