Sanitizer: removeUnsafe() Methode

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Die removeUnsafe() Methode des Sanitizer Interface konfiguriert die Sanitizer-Konfiguration so, dass alle Elemente, Attribute und Ereignis-Handler-Attribute, die vom Browser als XSS-unsicher betrachtet werden, entfernt werden.

Die unsicheren Elemente und Attribute werden zur Konfiguration hinzugefügt, indem Sanitizer.removeElement() und Sanitizer.removeAttribute() für jedes aufgerufen wird. Dies fügt sie zu den Negativlisten der Sanitizer-Konfiguration hinzu: removeElements und removeAttributes, und entfernt sie (falls vorhanden) aus den Positivlisten der Konfiguration: elements, replaceWithChildrenElements und attributes.

Die Methode kann aufgerufen werden, um jede benutzerdefinierte Konfiguration XSS-sicher zu machen. Wenn sie mit einer Konfiguration verwendet wird, die Positivlisten verwendet, werden die XSS-unsicheren Entitäten aus diesen Listen entfernt. Wenn sie mit einer Konfiguration verwendet wird, die nur die Negativlisten (entfernen) verwendet, stellt sie sicher, dass die Konfiguration die unsicheren Elemente in diesen Listen enthält.

Beachten Sie, dass, wenn Sie den Sanitizer mit einem der "sicheren" HTML-Setter verwenden, wie zum Beispiel Element.setHTML() und ShadowRoot.setHTML(), Sie diese Methode nicht aufrufen müssen, um den Sanitizer sicher zu machen. Wenn sie in diesen Settern verwendet wird, wird die Methode implizit aufgerufen, ohne die übergebene Sanitizer-Instanz zu modifizieren.

Syntax

removeUnsafe()

Parameter

Keine.

Rückgabewert

Keine (undefined).

Beispiele

Grundlegende Verwendung

Der folgende Code zeigt, wie removeUnsafe() verwendet wird.

// Create sanitizer.
const sanitizer = new Sanitizer(/* Some configuration */);

// Make the configuration XSS-safe
sanitizer.removeUnsafe();

Eine Sanitizer-Konfiguration sicher machen

Dieses Beispiel demonstriert, wie durch den Aufruf von removeUnsafe() die Sanitizer-Konfiguration XSS-sicher gemacht wird.

<pre id="log"></pre>

#log {
  height: 420px;
  overflow: scroll;
  padding: 0.5rem;
  border: 1px solid black;
}

const logElement = document.querySelector("#log");
function log(text) {
  logElement.textContent += text;
}

JavaScript

Der Code erstellt zuerst ein neues Sanitizer-Objekt, das das sichere Element <p>, die unsicheren Elemente <script> und <iframe>, sowie das unsichere onwebkitanimationend Ereignis-Handler-Attribut erlaubt.

Der Code ruft dann removeUnsafe() auf dem Sanitizer auf und protokolliert dessen Konfiguration.

if ("Sanitizer" in window) {

// Create sanitizer that allows
const sanitizer = new Sanitizer({
  elements: ["p", "script"],
  attributes: ["onwebkitanimationend"],
  replaceWithChildrenElements: ["iframe"],
});

// Make the sanitizer safe!
sanitizer.removeUnsafe();

// Log the sanitizer configuration
const sanitizerConfig = sanitizer.get();
log(JSON.stringify(sanitizerConfig, null, 2));

} else {
  log("The HTML Sanitizer API is NOT supported in this browser.");
}

Ergebnisse

Die resultierende Konfiguration wird unten gezeigt. Beachten Sie, wie die unsicheren Elemente und Attribute von den Positivlisten zu den entsprechenden Negativlisten verschoben wurden. In diesem Fall haben wir immer noch <p> in den erlaubten Elementen, sodass nur <p>-Elemente aus der Eingabe importiert werden, wenn der Sanitizer verwendet wird.

Spezifikationen

Specification
HTML Sanitizer API # dom-sanitizer-removeunsafe