HTML-Tools

Kostenlose Trusted Types Policy Generator

Generieren Sie Trusted Types-Richtlinien und CSP-Header, um DOM-basierte XSS durch typisierte Werte fur gefahrliche DOM-Senken zu verhindern.

Tool wird geladen...

Was ist Trusted Types Policy Generator?

Trusted Types ist eine Browser-Sicherheits-API, die DOM-basiertes XSS verhindert, indem sie typisierte Werte anstelle von Strings für gefährliche DOM-Senken wie innerHTML, eval() und script.src erzwingt. Entwickler verwenden trustedTypes.createPolicy(), um Bereinigungsregeln zu definieren, die nicht vertrauenswürdige Strings transformieren oder ablehnen, bevor sie Injektionssenken erreichen. In Kombination mit einer Content-Security-Policy-Direktive schließt Trusted Types eine große Klasse von XSS-Schwachstellen, indem nur explizit erlaubte Operationen Werte an risikoreiche DOM-Eigenschaften zuweisen können.

Kurze Antwort

Trusted Types verhindert DOM-basiertes XSS, indem Strings von gefährlichen DOM-Senken wie innerHTML und eval() blockiert werden. Verwenden Sie trustedTypes.createPolicy() mit createHTML/createScript/createScriptURL-Operationen und erzwingen Sie die Policy mit Content-Security-Policy: require-trusted-types-for 'script'. Testen Sie immer zuerst im Report-Only-Modus mit Content-Security-Policy-Report-Only, um vorhandene Funktionalität nicht zu beeinträchtigen.

Last updated: 2026-05-31

Einschränkungen

  • Trusted Types erfordert Browserunterstützung in Chrome 83+, Edge 83+ und Safari 17+. Firefox unterstützt Trusted Types Stand 2026 nicht. Anwendungen müssen Firefox ohne Trusted Types Schutz durch Fallback-Verhalten für nicht unterstützte Browser behandeln.
  • Trusted Types deckt nicht alle XSS-Vektoren ab - es schützt DOM-Injektionssenken (innerHTML, outerHTML, insertAdjacentHTML, eval, document.write), verhindert aber kein XSS über URL-Attribute (href, src), Event-Handler-Attribute oder CSS-basierte Injektionsvektoren.
  • Die Migration großer Anwendungen zu Trusted Types erfordert erhebliche Refaktorisierung. Jede innerHTML-, insertAdjacentHTML-, outerHTML- und document.write-Nutzung muss in eine Policy eingewickelt werden, was in einer Legacy-Codebase mit umfangreicher dynamischer DOM-Manipulation hunderte von Quellcodeänderungen umfassen kann.

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

So nutzt du dieses Tool

  1. Konfigurieren Sie die erlaubten Operationen - createHTML, createScript, createScriptURL - und legen Sie fest, wie jede Operation Eingaben behandelt: strikte Ablehnung (alle nicht vertrauenswürdigen Eingaben blockieren), Bereinigung (durch eine Sanitizer-Funktion leiten) oder Durchreichen für vertrauenswürdige Quellen.
  2. Wählen Sie den CSP-Modus - Enforce (require-trusted-types-for 'script' in Content-Security-Policy) blockiert Verstöße, oder Report-Only (gleiche Direktive in Content-Security-Policy-Report-Only) protokolliert Verstöße ohne Blockierung. Beginnen Sie während der Migration immer mit dem Report-Only-Modus.
  3. Wählen Sie Ihre Server-Plattform - Nginx oder Apache - um die entsprechende CSP-Header-Konfiguration zu generieren, die in Ihre bestehenden Server-Blöcke oder virtuellen Hosts integriert wird.
  4. Stellen Sie die Policy-JavaScript-Datei und die Server-Konfiguration bereit und testen Sie Ihre Anwendung im Report-Only-Modus. Überprüfen Sie die Konsolen-Verstoßberichte und passen Sie die Policies an, bis keine Verstöße mehr auftreten, und wechseln Sie dann in den Enforce-Modus.

Wofür du es nutzen kannst

  • Schützen Sie eine inhaltsreiche Webanwendung vor gespeichertem und reflektiertem XSS, indem alle HTML-Injektionspunkte durch eine Trusted Types Policy mit einer konfigurierten Sanitizer-Funktion laufen müssen.
  • Migrieren Sie eine Legacy-Anwendung zu Trusted Types, indem Sie zuerst im Report-Only-Modus bereitstellen, Verstoßberichte inkrementell im gesamten Codebase beheben und dann in den vollständigen Enforce-Modus wechseln.
  • Erzwingen Sie eine strenge Trusted Types Policy in Umgebungen mit vielen Drittanbieter-Skripten, in denen externe Widgets und Einbettungen dynamische Inhalte über innerHTML laden.

Anwendungsfalle

Praxisbeispiele

Beispiel

Report-Only Migration für eine Legacy-App

Ein großes Admin-Dashboard verwendet innerHTML für verschiedene dynamische Widgets. Stellen Sie Trusted Types zuerst im Report-Only-Modus bereit, indem Sie require-trusted-types-for 'script' im Content-Security-Policy-Report-Only-Header setzen. Sammeln Sie Verstoßberichte, refaktorisieren Sie jedes Widget für eine Trusted Types Policy und wechseln Sie dann in den Content-Security-Policy-Enforce-Modus, sobald alle Verstöße behoben sind.

Beispiel

Strenge Policy für einen CMS-Editor

Ein CMS mit einem Rich-Text-Editor muss benutzergenerierte HTML-Inhalte sicher rendern. Erstellen Sie eine Trusted Types Policy mit einer createHTML-Funktion, die HTML durch einen DOMPurify-ähnlichen Sanitizer leitet, bevor sie ein TrustedHTML-Objekt zurückgibt. Alle innerHTML-Zuweisungen laufen durch diese Policy, was XSS verhindert, selbst wenn schädliche Inhalte die serverseitige Filterung umgehen.

Haufige Fehler

  • Trusted Types im Enforce-Modus bereitzustellen, ohne vorher im Report-Only-Modus zu testen - eine strenge Policy kann jede Funktion zerstören, die innerHTML, outerHTML oder insertAdjacentHTML verwendet. Validieren Sie immer zuerst mit Report-Only, bevor Sie erzwingen.
  • DefaultPolicy als pauschale Erlaubnis zu verwenden - trustedTypes.createPolicy('default', { createHTML: (s) => s }) umgeht den gesamten XSS-Schutz, indem jeder String unverändert durchgelassen wird. Eine Standard-Policy sollte bereinigen, nicht durchreichen.
  • Zu vergessen, dass eval() eine Trusted Types Senke ist - wenn Ihre Anwendung JSON.parse() auf eval-kompatiblen Strings verwendet oder auf dynamische Codeausführung angewiesen ist, müssen diese Aufrufe durch eine createScript-Policy oder eine separate CSP-script-src-Direktive gesteuert werden.

Überprüfung

  1. Öffnen Sie die Browser-DevTools-Konsole nach der Bereitstellung der Trusted Types Policy im Enforce-Modus. Jeder Verstoß blockiert die Operation und protokolliert einen TypeError mit Details zur blockierten Zuweisung und der betroffenen DOM-Senke. Überprüfen Sie, dass die normale Anwendungsnutzung null Verstöße produziert.
  2. Wechseln Sie vorübergehend in den Report-Only-Modus und verwenden Sie den Reiter 'Issues' in Chrome DevTools, um Trusted Types Verstoßberichte zu inspizieren. Filtern Sie nach 'trusted-types', um alle potenziellen Verstöße gruppiert nach Senkentyp und Quellort zu sehen.

FAQ

Fragen zu Trusted Types Policy Generator

Schützt Trusted Types vor bestehenden XSS-Schwachstellen?

Ja, wenn die Schwachstelle erfordert, dass ein String an eine DOM-Senke wie innerHTML, outerHTML oder insertAdjacentHTML übergeben wird. Trusted Types erzwingt, dass alle Zuweisungen an diese Senken durch eine Policy laufen - wenn keine Policy existiert oder die Policy die Eingabe ablehnt, wird die Zuweisung blockiert. Trusted Types schützt jedoch nicht vor XSS über URL-Attribute (href, src), Event-Handler (onclick, onerror) oder serverseitige Injektion. Es zielt speziell auf DOM-Injektionssenken ab.

Kann ich Trusted Types mit React, Vue oder Angular verwenden?

Ja, aber die Integration variiert pro Framework. React unterstützt Trusted Types über seinen erwarteten typisierten Objektvertrag - dangerouslySetInnerHTML akzeptiert TrustedHTML-Objekte. Vue benötigt einen benutzerdefinierten Policy-Wrapper für v-html-Bindungen. Angular bietet eine DomSanitizer-Integration, die für Trusted Types konfiguriert werden kann. Prüfen Sie die Dokumentation des jeweiligen Frameworks für spezifische Details zur Trusted Types Unterstützung.

Was passiert mit Drittanbieter-Skripten unter Trusted Types?

Drittanbieter-Skripte, die Werte an DOM-Senken (innerHTML, document.write, outerHTML) zuweisen, werden blockiert, es sei denn, sie laufen durch eine Trusted Types Policy. Möglicherweise müssen Sie eine Policy erstellen, die bestimmte vertrauenswürdige Skripte erlaubt, oder eine 'trusted-types'-Direktive im CSP-Header hinzufügen, die erlaubte Policy-Namen auflistet. Drittanbieter-Skript-Widgets brechen häufig unter Trusted Types und benötigen eine explizite Policy-Konfiguration.

Wie gehe ich mit Trusted Types im Report-Only-Modus um?

Setzen Sie Content-Security-Policy-Report-Only: require-trusted-types-for 'script' anstelle des erzwingenden Content-Security-Policy-Headers. Der Browser protokolliert Verstöße in der Konsole und sendet Berichte an den konfigurierten report-uri-Endpunkt, ohne Operationen zu blockieren. Überprüfen Sie alle Verstoßberichte, erstellen Sie geeignete Policies für jede Senkennutzung und wechseln Sie dann in den Enforce-Modus, indem Sie die Direktive in den Content-Security-Policy-Header verschieben.

Verwandte Tools

Weitere html-tools

Auch ausprobieren

Auch ausprobieren