SanitizerConfig
Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Das SanitizerConfig-Wörterbuch der HTML Sanitizer API spezifiziert, welche Elemente, Attribute und Kommentare erlaubt sind oder entfernt werden sollten, wenn HTML-Strings in ein Element oder ShadowRoot eingefügt werden, oder wenn ein HTML-String in ein Document geparst wird.
Es ist zu beachten, dass normalerweise Sanitizer-Instanzen anstelle von SanitizerConfig-Objekten verwendet werden, da sie effizienter sind zu teilen und zu modifizieren.
Instanzeigenschaften
elements-
Ein Array, das die Elemente angibt, die beim Bereinigen von HTML erlaubt sind. Optional können auch deren erlaubte oder entfernte Attribute angegeben werden.
Jedes Element kann durch den Namen (ein String) oder als Objekt mit den folgenden Eigenschaften angegeben werden:
name-
Ein String, der den Namen des Elements enthält.
namespaceOptional-
Ein String, der den Namensraum des Elements enthält. Der Standard-Namensraum ist
"http://www.w3.org/1999/xhtml". attributesOptional-
Ein Array, das die Attribute angibt, die auf diesem (erlaubten) Element beim Bereinigen von HTML erlaubt sind.
Jedes Attribut kann durch den Namen (ein String) oder als Objekt mit den folgenden Eigenschaften angegeben werden:
name-
Ein String, der den Namen des Attributs enthält.
namespaceOptional-
Ein String, der den Namensraum des Attributs enthält, der standardmäßig
nullist.
removeAttributesOptional-
Ein Array, das die Attribute angibt, die auf diesem (erlaubten) Element beim Bereinigen von HTML entfernt werden sollen.
Jedes Attribut kann durch den Namen (ein String) oder als Objekt mit den folgenden Eigenschaften angegeben werden:
name-
Ein String, der den Namen des Attributs enthält.
namespaceOptional-
Ein String, der den Namensraum des Attributs enthält, der standardmäßig
nullist.
removeElements-
Ein Array, das die Elemente angibt, die beim Bereinigen von HTML entfernt werden sollen.
Jedes Element kann durch den Namen (ein String) oder als Objekt mit den folgenden Eigenschaften angegeben werden:
name-
Ein String, der den Namen des Elements enthält.
namespaceOptional-
Ein String, der den Namensraum des Elements enthält. Der Standard-Namensraum ist
"http://www.w3.org/1999/xhtml".
replaceWithChildrenElements-
Ein Array, das die Elemente angibt, die mit ihrem Inhalt ersetzt werden sollen, wenn HTML bereinigt wird. Dies wird hauptsächlich verwendet, um Stile von Text zu entfernen (zum Beispiel könnten Sie dies verwenden, um
<b>einige Texte</b>ineinige Textezu ändern).Jedes Element kann durch den Namen (ein String) oder als Objekt mit den folgenden Eigenschaften angegeben werden:
name-
Ein String, der den Namen des Elements enthält.
namespaceOptional-
Ein String, der den Namensraum des Elements enthält. Der Standard-Namensraum ist
"http://www.w3.org/1999/xhtml".
attributes-
Ein Array, das die Attribute angibt, die beim Bereinigen von HTML erlaubt sind.
Jedes Attribut kann durch den Namen (ein String) oder als Objekt mit den folgenden Eigenschaften angegeben werden:
name-
Ein String, der den Namen des Attributs enthält.
namespaceOptional-
Ein String, der den Namensraum des Attributs enthält, der standardmäßig
nullist.
removeAttributes-
Ein Array, das angibt, welche Attribute von Elementen beim Bereinigen von HTML entfernt werden sollen.
Jedes Attribut kann durch den Namen (ein String) oder als Objekt mit den folgenden Eigenschaften angegeben werden:
name-
Ein String, der den Namen des Attributs enthält.
namespaceOptional-
Ein String, der den Namensraum des Attributs enthält, der standardmäßig
nullist.
comments-
true, wenn Kommentare erlaubt sind, undfalse, wenn sie entfernt werden sollen. dataAttributes-
true, wenn alledata-*-Attribute erlaubt sind (in diesem Fall müssendata-*-Attribute nicht in derattributes-Liste aufgeführt werden). Wennfalse, müssen alle erlaubtendata-*-Attribute in derattributes-Liste aufgeführt werden.
Beschreibung
Ein SanitizerConfig spezifiziert, welche Elemente, Attribute und Kommentare erlaubt sind oder entfernt werden sollten, wenn Strings von HTML in ein Element oder ShadowRoot eingefügt werden oder wenn ein HTML-String in ein Document geparst wird.
Eine Instanz dieser Art kann beim Sanitizer()-Konstruktor übergeben werden, um einen Sanitizer zu konfigurieren und wird von Sanitizer.get() zurückgegeben.
Es kann auch als option.sanitizer-Parameter übergeben werden, wenn die Bereinigungsmethoden aufgerufen werden:
setHTML()odersetHTMLUnsafe()aufElement.setHTML()odersetHTMLUnsafe()aufShadowRoot.Document.parseHTML()oderDocument.parseHTMLUnsafe()statische Methoden.
Gültige Konfiguration
Die Struktur des Konfigurationsobjekts ermöglicht die Deklaration von Filteroptionen, die widersprüchlich oder redundant sind, wie das Angeben eines Elements in sowohl Erlauben- als auch Entfernungslisten oder das mehrfache Auflisten eines Attributs in einer Liste.
Um jede Mehrdeutigkeit zu vermeiden, erfordern Methoden, die eine SanitizerConfig-Instanz akzeptieren, dass ein gültiges Konfigurationsobjekt übergeben wird, und werfen einen TypeError, wenn eine ungültige Konfiguration verwendet wird.
In einer gültigen Sanitizer-Konfiguration:
-
Entweder das
elements- oder dasremoveElements-Array kann definiert sein, aber nicht beide.Hinweis: Es ist unmöglich, für Elemente spezifische Attribute zu definieren, wenn das
removeElements-Array definiert ist, da diese den Elementen imelements-Array hinzugefügt werden. -
Entweder das globale
attributes- oder dasremoveAttributes-Array kann definiert sein, aber nicht beide. -
Das
replaceWithChildrenElements-Array, wenn definiert, darf keine gemeinsamen Elemente mitelementsoderremoveElementshaben. -
Kein Array darf doppelte Elemente oder Attribute enthalten.
-
Wenn das globale
attributes-Array definiert ist:- Ein Element kann eines oder keines von
attributesundremoveAttributesdefinieren. - Ein Element's
attributesdarf keine gemeinsamen Werte mit dem globalenattributes-Array haben. - Ein Element's
removeAttributes-Array darf nur Werte enthalten, die auch im globalenattributes-Array vorhanden sind. - Wenn
dataAttributestrueist, dürfen die globalen und Element-Attribut-Arrays keinedata-*-Attribute enthalten (da diese automatisch erlaubt sind).
- Ein Element kann eines oder keines von
-
Wenn das globale
removeAttributes-Array definiert ist:- Ein Element kann entweder
attributesoderremoveAttributesangeben, aber nicht beides. - Ein Element's
attributes- oderremoveAttributes-Array, je nachdem welches (wenn überhaupt) definiert ist, darf keine gemeinsamen Werte mit dem globalenremoveAttributes-Array haben. - Die
dataAttributes-Boolescherwert darf nicht definiert sein.
- Ein Element kann entweder
Das leere Objekt {} ist eine gültige Konfiguration.
Hinweis:
Die oben genannten Bedingungen gelten aus der Perspektive eines Webentwicklers.
Die Gültigkeitsprüfung, die in der Spezifikation definiert ist, ist etwas anders, weil sie nach der Kanonisierung der Konfiguration durchgeführt wird, wie das Hinzufügen von removeElements, wenn beide fehlen, und das Hinzufügen von Standard-Namensräumen.
Erlauben- und Entfernen-Konfigurationen
Eine der Hauptimplikationen des vorherigen Abschnitts ist, dass eine gültige Konfiguration entweder elements- oder removeElements-Arrays (aber nicht beide) und entweder attributes- oder removeAttributes-Arrays (aber nicht beide) spezifizieren kann.
Eine Konfiguration, die über die elements- und/oder attributes-Arrays verfügt, wird als Erlauben-Konfiguration bezeichnet, da sie das Bereinigungsverhalten in Bezug auf die Werte definiert, die im Ausgang erlaubt sind.
Eine Entfernen-Konfiguration ist eine, die entweder removeElements und/oder removeAttributes enthält und das Verhalten in Bezug auf die Werte definiert, die aus dem Ausgang entfernt werden.
Beispiele
>Erstellen einer "erlauben" Konfiguration
Dieses Beispiel zeigt, wie Sie eine "erlauben" Sanitizer-Konfiguration erstellen könnten, die spezifische Elemente und Attribute erlaubt, <b>-Elemente durch ihre Kinder ersetzt, erlaubt, dass Kommentare in der Ausgabe enthalten sind, und erfordert, dass data-*-Attribute explizit in der attributes-Liste aufgeführt werden, um enthalten zu sein.
Das Konfigurationsobjekt wird dem Sanitizer()-Konstruktor übergeben.
const sanitizer = new Sanitizer({
elements: ["div", "p", "script"],
attributes: ["id"],
replaceWithChildrenElements: ["b"],
comments: true,
dataAttributes: false,
});
Erstellen einer "entfernen" Konfiguration
Dieses Beispiel zeigt, wie Sie eine "entfernen" Sanitizer-Konfiguration erstellen könnten, die sowohl Elemente als auch Attribute entfernt.
const sanitizer = new Sanitizer({
removeElements: ["span", "script"],
removeAttributes: ["lang", "id"],
comments: false,
});
Erlauben von Elementen und Entfernen von Attributen Konfiguration
Dieses Beispiel zeigt, wie Sie eine "hybrid" Sanitizer-Konfiguration erstellen könnten, die einige Elemente erlaubt und bestimmte Attribute entfernt. Sie könnten ähnlich eine Konfiguration spezifizieren, die Elemente entfernt und Attribute erlaubt.
const sanitizer = new Sanitizer({
elements: ["span", "script"],
removeAttributes: ["lang", "id"],
});
Beachten Sie, dass das gleichzeitige Vorhandensein von Erlauben- und Entfernen-Arrays für Elemente oder sowohl Erlauben- als auch Entfernen-Arrays für Attribute keine gültige Konfiguration ist und zu einem TypeError führen würde.
Ungültige Konfigurationen
Dieser Abschnitt zeigt eine Reihe von ungültigen Konfigurationen.
Diese werden einen TypeError werfen.
Ungültig, weil sowohl elements als auch removeElements definiert sind:
const sanitizer1 = new Sanitizer({
elements: ["span", "script"],
removeElements: ["div", "b"],
});
Ungültig, weil <span> sowohl in elements als auch in removeElements enthalten ist.
const sanitizer2 = new Sanitizer({
elements: ["span", "div"],
replaceWithChildrenElements: ["span"],
});
Ungültig, weil das redundante Attribut "data-test" definiert ist, wenn dataAttributes wahr ist:
const sanitizer3 = new Sanitizer({
attributes: ["lang", "id", "data-test"],
dataAttributes: true,
});
Ungültig, weil es removeAttributes und dataAttributes definiert hat.
const sanitizer4 = new Sanitizer({
removeAttributes: ["lang", "id"],
dataAttributes: true,
});
Spezifikationen
| Specification |
|---|
| HTML Sanitizer API> # dom-sanitizer-get> |
| HTML Sanitizer API> # dom-sanitizer-sanitizer> |