Trusted Types API

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Hinweis: Dieses Feature ist verfügbar in Web Workers.

Die Trusted Types API bietet Webentwicklern eine Möglichkeit, die unsicheren Teile der DOM-API zu sperren, um clientseitige Cross-Site-Scripting (XSS)-Angriffe zu verhindern.

Konzepte und Nutzung

Clientseitige oder DOM-basierte XSS-Angriffe treten auf, wenn von einem Benutzer kontrollierte Daten (wie z.B. Eingaben in ein Formularfeld) eine Funktion erreichen, die diese Daten ausführen kann. Diese Funktionen werden als Injection Sinks bezeichnet. DOM-basierte XSS-Angriffe passieren, wenn ein Benutzer in der Lage ist, beliebigen JavaScript-Code zu schreiben und durch eine dieser Funktionen ausführen zu lassen.

Die Trusted Types API sperrt riskante Injection Sinks und erfordert, dass Sie die Daten verarbeiten, bevor Sie sie einer dieser Funktionen übergeben. Wenn Sie einen String verwenden, wird der Browser einen TypeError auslösen und die Nutzung der Funktion verhindern.

Trusted Types arbeitet zusammen mit der Content-Security-Policy unter Verwendung der trusted-types- und require-trusted-types-for-Direktiven.

Injection Sinks

Die Trusted Types API sperrt Injection Sinks, die als Vektor für DOM-XSS-Angriffe dienen können. Ein Injection Sink ist jede Web-API-Funktion, die nur mit vertrauenswürdigen, validierten oder bereinigten Eingaben aufgerufen werden sollte. Beispiele für Injection Sinks sind:

Trusted Types wird Sie dazu zwingen, die Daten zu verarbeiten, bevor Sie sie an einen Injection Sink übergeben, anstatt einen String zu verwenden. Dies stellt sicher, dass die Daten vertrauenswürdig sind.

Trusted Type Policies

Eine Richtlinie ist eine Fabrik für Trusted Types. Webentwickler können eine Reihe von Richtlinien spezifizieren, die zur Erstellung typisierter Objekte verwendet werden, die die vertrauenswürdige Codebasis für gültige Trusted Type-Objekte bilden.

Schnittstellen

TrustedHTML

Repräsentiert einen String, der in einen Injection Sink eingefügt wird, der ihn als HTML rendert.

TrustedScript

Repräsentiert einen String, der in einen Injection Sink eingefügt wird, der dazu führen könnte, dass der Script ausgeführt wird.

TrustedScriptURL

Repräsentiert einen String, der in einen Injection Sink eingefügt wird, der ihn als URL einer externen Skriptressource analysiert.

TrustedTypePolicy

Definiert die Funktionen zur Erstellung der obigen Trusted Type-Objekte.

TrustedTypePolicyFactory

Erstellt Richtlinien und überprüft, ob Trusted Type-Objektinstanzen über eine der Richtlinien erstellt wurden.

Beispiele

Im folgenden Beispiel erstellen wir eine Richtlinie, die TrustedHTML-Objekte unter Verwendung von TrustedTypePolicyFactory.createPolicy() erstellt. Wir können dann TrustedTypePolicy.createHTML() verwenden, um einen bereinigten HTML-String zu erstellen, der in das Dokument eingefügt werden soll.

Der bereinigte Wert kann dann mit Element.innerHTML verwendet werden, um sicherzustellen, dass keine neuen HTML-Elemente injiziert werden können.

html
<div id="myDiv"></div>
js
const escapeHTMLPolicy = trustedTypes.createPolicy("myEscapePolicy", {
  createHTML: (string) =>
    string
      .replace(/&/g, "&amp;")
      .replace(/</g, "&lt;")
      .replace(/"/g, "&quot;")
      .replace(/'/g, "&apos;"),
});

let el = document.getElementById("myDiv");
const escaped = escapeHTMLPolicy.createHTML("<img src=x onerror=alert(1)>");
console.log(escaped instanceof TrustedHTML); // true
el.innerHTML = escaped;

Lesen Sie mehr über dieses Beispiel und entdecken Sie andere Möglichkeiten zur Bereinigung von Eingaben im Artikel Verhindern von DOM-basierten Cross-Site-Scripting-Schwachstellen mit Trusted Types.

Spezifikationen

Specification
Trusted Types

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch