jquery.app
Deutsch
EnglishDeutschFrancaisEspanol日本語Nederlands

SEO-Tools

Kostenlose CSP-Starter-Policy-Generator

Generiere einen Content-Security-Policy-Header für statische Sites mit CDN-, Analyse-, Schrift- und Embed-Optionen.

Tool wird geladen...

Was ist CSP-Starter-Policy-Generator?

Content-Security-Policy (CSP) ist ein Browser-Sicherheits-Header, der steuert, welche Ressourcen eine Seite laden darf. Er hilft, Cross-Site-Scripting, Dateninjektion und andere Code-Injektionsangriffe zu verhindern. Für statische Seiten kann ein CSP-Header einfach und konservativ sein, da die meisten statischen Seiten Ressourcen von vorhersehbaren, kontrollierten Ursprüngen laden.

Kurze Antwort

Eine Content Security Policy blockiert Cross-Site-Scripting und Dateninjektionsangriffe, indem sie einschränkt, welche Ressourcen der Browser laden darf. Beginnen Sie mit einer restriktiven Richtlinie und erweitern Sie sie nur bei Bedarf.

Last updated: 2026-05-25

Einschränkungen

  • CSP schützt nicht vor serverseitigen Schwachstellen oder kompromittierten Drittanbieter-Bibliotheken, die bereits in der Richtlinie enthalten sind.
  • Inline-Event-Handler und javascript:-URLs werden blockiert, es sei denn, 'unsafe-inline' oder ein Hash/Nonce ist gesetzt.
  • GitHub Pages unterstützt keine benutzerdefinierten HTTP-Header; verwenden Sie stattdessen ein meta-Tag-basiertes CSP, das jedoch eingeschränkte Direktivenunterstützung bietet.

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

So nutzt du dieses Tool

  1. Wählen Sie eine Voreinstellung, die zu Ihrem Site-Typ passt: statisch, mit CDN, mit Analytics oder mit eingebetteten Inhalten.
  2. Überprüfen Sie die generierten Direktiven und schalten Sie zusätzliche Quellen um, die Ihre Site benötigt.
  3. Kopieren Sie den CSP-Header in Ihre Hosting-Konfiguration oder als meta-Tag.
  4. Stellen Sie zuerst die Report-Only-Version bereit und überprüfen Sie die Browser-Konsole auf Verstöße, bevor Sie die Richtlinie durchsetzen.

Wofür du es nutzen kannst

  • Ein konservatives CSP für eine einfache statische HTML-Seite ohne externe Ressourcen erstellen.
  • Skript- und Schriftquellen für Google Fonts, Bootstrap CDN oder Google Analytics hinzufügen.
  • Ein CSP für GitHub Pages vorbereiten, das den Hosting-Ursprung berücksichtigt.

Anwendungsfalle

Praxisbeispiele

Beispiel

CSP für einfache statische Site

Eine handcodierte HTML-Site ohne CDN, Analytics oder Embeds erhält ein minimales CSP, das nur den eigenen Ursprung für alle Ressourcentypen erlaubt.

Beispiel

Statische Site mit CDN und Analytics

Eine Site mit einem CSS-Framework-CDN, Google Fonts und Google Analytics erhält ein CSP, das diese Ursprünge erlaubt und alles andere blockiert.

Haufige Fehler

  • Ein CSP im Enforce-Modus bereitstellen, ohne es vorher im Report-Only-Modus zu testen, was legitime Ressourcen blockieren kann.
  • 'unsafe-inline' für Skripte verwenden, ohne zu verstehen, dass dies den meisten XSS-Schutz von CSP deaktiviert.
  • Vergessen, die GitHub Pages Preview-Domain oder den CDN-Ursprung zur Richtlinie hinzuzufügen, was die Site bei der Bereitstellung beschädigt.

Überprüfung

  1. Stellen Sie das CSP zuerst im Report-Only-Modus bereit, indem Sie Content-Security-Policy-Report-Only verwenden, und überprüfen Sie die Browser-Konsole auf Verstöße.
  2. Wechseln Sie erst zum Enforce-Header, nachdem Sie bestätigt haben, dass keine legitimen Ressourcen blockiert werden.

Vergleich

CSP vs Permissions-Policy vs Referrer-Policy

AspectContent-Security-PolicyPermissions-PolicyReferrer-Policy
What it controlsWhich resources (scripts, styles, images, fonts) the page can load and from which originsWhich browser features (camera, microphone, geolocation, payment) the page can accessHow much referrer information is sent when the page navigates to or loads a resource from another origin
Example directivesdefault-src 'self'; script-src 'self' cdn.example.com; img-src *camera=(), geolocation=(self), fullscreen=*strict-origin-when-cross-origin, no-referrer, same-origin
Delivered as header or metaBoth. HTTP header is preferred. Meta tag works but does not support frame-ancestors or report-uri.HTTP header only. Meta tag is not supported for Permissions-Policy.Both. Meta tag works and is commonly used for static pages.
What happens if misconfiguredResources are blocked. The page may appear broken with missing styles, scripts, or images.Features silently fail. JavaScript calls to blocked APIs throw without visible browser UI.Referrer data is sent with unintended detail or is missing when analytics need it.

CSP controls resource loading, Permissions-Policy controls feature access, and Referrer-Policy controls referrer data sent to other origins. They are complementary security headers that serve different purposes.

FAQ

Fragen zu CSP-Starter-Policy-Generator

Kann CSP als meta-Tag ausgeliefert werden?

Ja. Verwenden Sie <meta http-equiv="Content-Security-Policy" content="..."> im Seiten-Head. Beachten Sie, dass einige Direktiven wie frame-ancestors und report-uri im meta-Tag nicht funktionieren.

Sollte ich mit dem Report-Only-Modus beginnen?

Ja. Stellen Sie zuerst mit Content-Security-Policy-Report-Only bereit, überwachen Sie die Browser-Konsole auf Verstöße und wechseln Sie erst zum Enforce-Modus, wenn keine unerwarteten Verstöße mehr auftreten.

Was ist das sicherste default-src für eine statische Site?

default-src 'self' ist ein praktischer Ausgangspunkt. Es erlaubt Ressourcen vom selben Ursprung und blockiert alles andere. Fügen Sie spezifische Ursprünge für CDNs, Schriftarten und Analytics bei Bedarf hinzu.

Wie erlaube ich Google Analytics, Google Fonts oder ein CDN im CSP?

Fügen Sie den spezifischen Ursprung zur entsprechenden Direktive hinzu. Für Google Analytics: script-src https://www.googletagmanager.com und connect-src https://www.google-analytics.com. Stellen Sie zuerst im Report-Only-Modus bereit.

Verwandte Tools

Weitere seo-tools

Auch ausprobieren

Auch ausprobieren