You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: files/en-us/web/api/document/parsehtmlunsafe_static/index.md
+3-2Lines changed: 3 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -50,9 +50,10 @@ A {{domxref("Document")}}.
50
50
- : This is thrown if:
51
51
-`html` is passed a string when [Trusted Types](/en-US/docs/Web/API/Trusted_Types_API) are [enforced by a CSP](/en-US/docs/Web/API/Trusted_Types_API#using_a_csp_to_enforce_trusted_types) and no default policy is defined.
52
52
-`options.sanitizer` is passed a:
53
-
-value that is not a {{domxref("Sanitizer")}}, {{domxref("SanitizerConfig")}}, or string.
54
-
- non-normalized {{domxref("SanitizerConfig")}} (one that includes both "allowed" and "removed" configuration settings).
53
+
- {{domxref("SanitizerConfig")}} that isn't [valid](/en-US/docs/Web/API/SanitizerConfig#valid_configuration).
54
+
For example, a configuration that includes both "allowed" and "removed" configuration settings.
55
55
- string that does not have the value `"default"`.
56
+
- value that is not a {{domxref("Sanitizer")}}, {{domxref("SanitizerConfig")}}, or string.
Copy file name to clipboardExpand all lines: files/en-us/web/api/element/sethtmlunsafe/index.md
+3-2Lines changed: 3 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -50,9 +50,10 @@ None (`undefined`).
50
50
- : This is thrown if:
51
51
-`input` is passed a string when [Trusted Types](/en-US/docs/Web/API/Trusted_Types_API) are [enforced by a CSP](/en-US/docs/Web/API/Trusted_Types_API#using_a_csp_to_enforce_trusted_types) and no default policy is defined.
52
52
-`options.sanitizer` is passed a:
53
-
-value that is not a {{domxref("Sanitizer")}}, {{domxref("SanitizerConfig")}}, or string.
54
-
- non-normalized {{domxref("SanitizerConfig")}} (one that includes both "allowed" and "removed" configuration settings).
53
+
- {{domxref("SanitizerConfig")}} that isn't [valid](/en-US/docs/Web/API/SanitizerConfig#valid_configuration).
54
+
For example, a configuration that includes both "allowed" and "removed" configuration settings.
55
55
- string that does not have the value `"default"`.
56
+
- value that is not a {{domxref("Sanitizer")}}, {{domxref("SanitizerConfig")}}, or string.
The other XSS-safe methods, {{domxref('ShadowRoot.setHTML()')}} and {{domxref('Document/parseHTML_static','Document.parseHTML()')}}, are used in the same way.
30
30
31
-
### Safe methods further restrict allowed entities
31
+
##Using a sanitizer configuration
32
32
33
-
You can specify the HTML entities that you want to allow or remove by passing a {{domxref('Sanitizer')}} in the second argument of all the sanitizer methods.
33
+
All of the sanitization methods can be passed a {{domxref('Sanitizer')}} or {{domxref('SanitizerConfig')}}, which defines what elements, attributes and comments are either allowed, or should be removed, when inserting strings of HTML.
34
34
35
-
For example, if you know that only {{htmlelement("p")}} and {{htmlelement("a")}} elements are expected in the context of "someElement" below, you might create a sanitizer configuration that allows only those elements:
35
+
The {{domxref('Sanitizer')}} is essentially a wrapper around a {{domxref('SanitizerConfig')}}, performing some optimizations and normalizations that make it easier and safer to use, share and modify,
36
+
37
+
### Using safe methods with a sanitizer
38
+
39
+
The XSS-safe methods always remove any unsafe HTML elements or attributes (as discussed in [Safe sanitization by default](#safe_sanitization_by_default) above).
40
+
41
+
You can pass a sanitizer as the second argument to the safe methods to allow the same or fewer entities than the default configuration.
42
+
For example, if you know that only {{htmlelement("p")}} and {{htmlelement("a")}} elements are expected in the context of `someElement` below, you might create a sanitizer configuration that allows only those elements:
Note though that the unsafe HTML entities are always removed when using the safe methods.
44
-
When used with the safe methods, a permissive sanitizer configuration, will either allow the same or fewer entities than the default configuration.
50
+
### Allowing unsafe sanitization
45
51
46
-
## Allowing unsafe sanitization
52
+
Sometimes you might want to inject input that needs to contain potentially unsafe elements or attributes.
53
+
In this case you could use one of the API XSS-unsafe methods: {{domxref('Element.setHTMLUnsafe()')}}, {{domxref('ShadowRoot.setHTMLUnsafe()')}}, and {{domxref('Document/parseHTMLUnsafe_static','Document.parseHTMLUnsafe()')}}.
47
54
48
-
Sometimes you might want to inject input needs to contain potentially unsafe elements or attributes.
49
-
In this case you can use one of the API XSS-unsafe methods: {{domxref('Element.setHTMLUnsafe()')}}, {{domxref('ShadowRoot.setHTMLUnsafe()')}}, and {{domxref('Document/parseHTMLUnsafe_static','Document.parseHTMLUnsafe()')}}.
50
-
51
-
A common approach is to start from the default sanitizer, which only allows safe elements, and then allow just those unsafe entities that we expect in the input.
55
+
To somewhat reduce the risk, you might first construct the default sanitizer, which only allows XSS-safe elements, and then allow just those unsafe entities that are expected in the input.
52
56
53
57
For example, in the following sanitizer all safe elements are allowed, and we further allow the unsafe `onclick` handler on `button` elements (only).
With this code the `alert(1)` would be allowed, and there is a potential issue that the attribute might be used for malicious purposes.
65
69
However we know that all other XSS unsafe HTML entities have been removed, so we only need to worry about this one case, and can put in other mitigations.
66
70
67
-
The unsafe methods will use any sanitizer configuration you supply (or none), so you need to be more careful than when using the safe methods.
71
+
The unsafe methods will use any sanitizer configuration you supply (or none), so you need to be careful when using them.
72
+
Minimally you should enforce [Trusted Types](/en-US/docs/Web/API/HTML_Sanitizer_API#sanitization_and_trusted_types) and pass {{domxref("TrustedHTML")}} instead of strings into the methods.
68
73
69
74
## Allow configurations
70
75
@@ -111,7 +116,7 @@ const sanitizer = new Sanitizer({
111
116
});
112
117
```
113
118
114
-
You can add the elements to the`Sanitizer` using its API.
119
+
You can also add the elements to a`Sanitizer` using {{domxref("Sanitizer.allowElement()")}}.
115
120
Here we add the same elements to an empty sanitizer:
116
121
117
122
```js
@@ -152,7 +157,7 @@ const sanitizer = new Sanitizer({
152
157
});
153
158
```
154
159
155
-
You can also add each of the allowed attributes to the`Sanitizer` using its `allowAttribute()` method:
160
+
You can also add each of the allowed attributes to a`Sanitizer` using the {{domxref("Sanitizer.allowAttribute()")}} method:
156
161
157
162
```js
158
163
constsanitizer=newSanitizer({});
@@ -192,7 +197,8 @@ const sanitizer = new Sanitizer({
192
197
In both cases you can also specify each attribute as an object with `name` and `namespace` properties.
193
198
You can also use set the attribute properties using the same element object passed to {{domxref("Sanitizer.allowElement()")}}.
194
199
195
-
Note however that you can't specify both element `attributes` and `removeAttributes` in one call. Attempting to do so will raise an exception.
200
+
Note that it is impossible to define per-element attribute behavior on a Sanitizer with a remove configuration, as the (needed) `elements` array is not present.
201
+
Other restrictions on per-element attributes are covered in [Valid configurations](/en-US/docs/Web/API/SanitizerConfig#valid_configuration)
The {{domxref("SanitizerConfig")}} can also be used to specify whether comments and `data-` attributes will be filtered from injected content, using the [comments](/en-US/docs/Web/API/SanitizerConfig#comments) and [dataAttributes](/en-US/docs/Web/API/SanitizerConfig#dataattributes) boolean properties, respectively.
305
+
The {{domxref("SanitizerConfig")}} can also be used to specify whether comments will be filtered from injected content, using the [`comments`](/en-US/docs/Web/API/SanitizerConfig#comments)property, and whether `data-` attributes are allowed without having to add them to the `attributes` array using the [`dataAttributes`](/en-US/docs/Web/API/SanitizerConfig#dataattributes) boolean property.
300
306
301
-
To allow both comments and data attributes you might use a configuration like this:
307
+
To allow comments and all `data-*` attributes you might use a configuration like this:
302
308
303
309
```js
304
310
constsanitizer=newSanitizer({
@@ -307,7 +313,7 @@ const sanitizer = new Sanitizer({
307
313
});
308
314
```
309
315
310
-
You can similarly enable or disable the comments or data-attributes on an existing sanitizer using {{domxref("Sanitizer.setComments()")}} and {{domxref("Sanitizer.setDataAttributes()")}} methods:
316
+
You can similarly set the comments or data-attributes properties on an existing sanitizer using {{domxref("Sanitizer.setComments()")}} and {{domxref("Sanitizer.setDataAttributes()")}}:
All the sanitization methods can be passed a sanitizer configuration that is either a {{domxref("Sanitizer")}} or {{domxref("SanitizerConfig")}} instance.
321
327
328
+
The {{domxref("SanitizerConfig")}} provides a compact method for specifying multiple elements or attributes that should be allowed or removed at the same time.
329
+
Some care may be required when modifying this object to ensure that it remains a [valid configuration](/en-US/docs/Web/API/SanitizerConfig#valid_configuration).
330
+
322
331
The {{domxref("Sanitizer")}} object is a wrapper around {{domxref("SanitizerConfig")}} that provides additional useful functionality:
323
332
324
333
- The default constructor creates a configuration that allows all XSS-safe elements and attributes, and which is therefore a good starting point for creating either slightly more or slightly less restrictive sanitizers.
325
-
- When you use the methods to allow or remove HTML entities, the entities are removed from the "opposite" lists.
326
-
These normalizations make the configuration more efficient.
334
+
- The `Sanitizer` methods ensure that the underlying `SanitizerConfig` remains a [valid configuration](/en-US/docs/Web/API/SanitizerConfig#valid_configuration).
335
+
For example, if you call `allowElement()` to allow an element then the element would also be removed from the underlying `replaceWithChildrenElements` array (if present).
336
+
The normalizations make the configuration more efficient.
327
337
- The {{domxref("Sanitizer.removeUnsafe()")}} method can be used to remove all XSS-unsafe entities from an existing configuration.
328
338
- You can export the configuration to see exactly what entities are allowed and dropped.
329
339
330
-
Note though, if you can use the safe sanitization methods, then you may not need to define a sanitizer configuration at all.
340
+
Note that if you can use the safe sanitization methods, then you may not need to define a sanitizer configuration at all.
The **`allowAttribute()`** method of the {{domxref("Sanitizer")}} interface sets an attribute to be allowed on all elements.
13
+
The **`allowAttribute()`** method of the {{domxref("Sanitizer")}} interface sets an attribute to be allowed on all elements when the sanitizer is used.
14
14
15
-
The specified attribute is added to the list of [`attributes`](/en-US/docs/Web/API/SanitizerConfig#attributes_2) in this sanitizer's configuration.
16
-
The attribute is removed from the [`removeAttributes`](/en-US/docs/Web/API/SanitizerConfig#removeattributes_2) list if present.
15
+
The method can be used with either an [allow configuration](/en-US/docs/Web/API/HTML_Sanitizer_API#allow_configurations) or a [remove configuration](/en-US/docs/Web/API/HTML_Sanitizer_API#remove_configurations).
16
+
If used with an allow configuration, the specified attribute is added to the `attributes` array.
17
+
If used with a remove configuration, the attribute is removed from the `removeAttributes` array (if present).
17
18
18
19
Note that to allow/disallow attributes only on specific elements use {{domxref('Sanitizer.allowElement()')}}.
19
20
@@ -34,7 +35,13 @@ allowAttribute(attribute)
34
35
35
36
### Return value
36
37
37
-
None (`undefined`).
38
+
`true` if the operation changed the configuration to allow the attribute, and `false` if the configuration already allowed the attribute.
39
+
40
+
Note that `false` might be returned if the internal configuration:
41
+
42
+
- defines an [`attributes`](/en-US/docs/Web/API/SanitizerConfig#attributes) array and the attribute is already present (it does not need to be added again)
43
+
- instead defines the [`removeAttributes`](/en-US/docs/Web/API/SanitizerConfig#removeattributes) array and the specified attribute is not present (and is hence already allowed)
44
+
-[`dataAttributes`](/en-US/docs/Web/API/SanitizerConfig#dataattributes) is set `true`, but a `data-*` attribute is passed.
The **`allowElement()`** method of the {{domxref("Sanitizer")}} interface sets that the specified element is allowed in the output when the sanitizer is used.
14
-
The element can be specified with lists of attributes that are allowed or disallowed on elements of that type.
15
14
16
-
The specified element is added to the [`elements`](/en-US/docs/Web/API/SanitizerConfig#elements) list in this sanitizer's configuration.
17
-
If the element is already present in the list, then the existing entry is first removed and the new definition is appended to the end of the list.
18
-
Note that if you need both per-element add-attribute and remove-attribute lists, they must be added in a single call to this method (since if done in two calls, the second call will replace the element definition added in the first call).
19
-
20
-
The specified element is removed from the sanitizer configuration [`removeElements`](/en-US/docs/Web/API/SanitizerConfig#removeelements) or [`replaceWithChildrenElements`](/en-US/docs/Web/API/SanitizerConfig#replacewithchildrenelements) lists if present.
15
+
It can also be used to specify per-element attribute allow or remove arrays on `Sanitizer` instances with an [allow configuration](/en-US/docs/Web/API/HTML_Sanitizer_API#allow_configurations).
21
16
22
17
## Syntax
23
18
@@ -54,7 +49,62 @@ allowElement(element)
54
49
55
50
### Return value
56
51
57
-
None (`undefined`).
52
+
`true` if the operation changed the configuration to allow the element, and `false` if the configuration was not changed (usually because the element was already allowed, but potentially because the change could not be made).
53
+
54
+
Note that `false` might be returned if the internal configuration:
55
+
56
+
- defines the [`elements`](/en-US/docs/Web/API/SanitizerConfig#elements) array and the element is already present (it does not need to be added again).
57
+
- defines the [`removeElements`](/en-US/docs/Web/API/SanitizerConfig#removeelements) array and the specified element is not present (and is hence already not filtered).
58
+
- defines the [`removeElements`](/en-US/docs/Web/API/SanitizerConfig#removeelements) array and attempts to allow an element with per-element attributes.
59
+
This operation is not supported because in a [valid configuration](/en-US/docs/Web/API/SanitizerConfig#valid_configuration) you can't have both `removeElements` and `elements` arrays, and per-element attributes are added in the `elements` array.
60
+
The call won't change the configuration and will generate a console warning.
61
+
62
+
## Description
63
+
64
+
The `allowElement()` method sets that the specified element is allowed in the output when the sanitizer is used.
65
+
66
+
The method can be used with either an [allow configuration](/en-US/docs/Web/API/HTML_Sanitizer_API#allow_configurations) or a [remove configuration](/en-US/docs/Web/API/HTML_Sanitizer_API#remove_configurations).
67
+
If used with an allow configuration, the specified element is added to the `elements` array.
68
+
If used with a remove configuration, the element is removed from the `removeElements` array (if present).
69
+
If present, it would also be removed from the [`replaceWithChildrenElements`](/en-US/docs/Web/API/SanitizerConfig#replacewithchildrenelements) array.
70
+
71
+
For example, the following code creates an allow `Sanitizer` that allows {{htmlelement("span")}} elements and then calls `allowElement()` to additionally allow {{htmlelement("b")}} elements.
When using a `Sanitizer` with an allow configuration you can also use the method to specify attributes to be allowed or disallowed on elements of that type.
79
+
For example, the following code first creates an allow sanitizer configuration by specifying the `elements` array (creating a `Sanitizer` with an empty object or no configuration object would also result in an "allow configuration").
80
+
It then calls `allowElement()` to allow `div` elements, to allow the `class` attribute on `<div>` elements, and to remove the `lang` attribute on `<div>` elements.
If you need both per-element add-attribute and remove-attribute arrays as shown above, they must be added in a single call to this method.
92
+
If you were to do this in two calls the the second call would replace the element definition added in the first call.
93
+
94
+
When using a `Sanitizer` with a [remove configuration](/en-US/docs/Web/API/HTML_Sanitizer_API#remove_configurations), similar code to add per-element attribute allow or remove arrays will generate a console warning and return `false`.
95
+
This is because internally the sanitizer doesn't have the `elements` array required to specify per-element attributes and won't change the configuration.
96
+
97
+
```js example-bad
98
+
// Define Sanitizer with a remove configuration
99
+
// by specifying removeElements in the configuration
0 commit comments