Sanitizer
Sanitizer 接口是 HTML Sanitizer API 的一部分,它定义了一个配置对象,用于指定在将 HTML 字符串插入 Element 或 ShadowRoot 时,或者在将 HTML 字符串解析为 Document 时,哪些元素、属性和注释是允许的或应该被移除的。
Sanitizer 实例本质上是 SanitizerConfig 的一个包装器,可以在相同的 清理方法 中作为配置的替代项传递。
- 在
Element上的setHTML()或setHTMLUnsafe()。 - 在
ShadowRoot上的setHTML()或setHTMLUnsafe()。 - 静态方法
Document.parseHTML()或Document.parseHTMLUnsafe()。
请注意,Sanitizer 被设计为更易于重用和修改。
构造函数
Sanitizer()实验性-
创建并返回一个
Sanitizer对象,可以选择使用SanitizerConfig定义自定义清理行为。
实例方法
Sanitizer.allowElement()实验性-
将一个元素设置为允许通过 sanitizer 进行处理,可以选择指定允许或不允许的属性列表。
Sanitizer.get()实验性-
以
SanitizerConfig字典实例的形式返回当前的Sanitizer配置。 Sanitizer.removeElement()实验性-
将一个元素设置为由 sanitizer 移除。
Sanitizer.removeUnsafe()实验性-
更新 sanitizer 配置,使其移除所有 XSS 不安全的 HTML。
Sanitizer.replaceElementWithChildren()实验性-
将一个元素设置为由其子元素替换。
Sanitizer.allowAttribute()实验性-
将一个属性设置为允许在任何元素上使用。
Sanitizer.removeAttribute()实验性-
将一个属性设置为从任何元素中移除。
Sanitizer.setComments()实验性-
设置是否允许或移除注释。
Sanitizer.setDataAttributes()实验性-
设置是否允许或移除元素上的 data 属性。
示例
更多示例请参阅 HTML Sanitizer API 和各个方法。下面我们展示一些创建不同 sanitizer 配置的示例。
创建默认 sanitizer
默认 sanitizer 的构造如下所示。
const sanitizer = new Sanitizer();
XSS 安全的 清理方法 在未传递任何选项时会自动创建相同的 sanitizer。
创建空的 sanitizer
要创建一个空的 sanitizer,向构造函数传递一个空对象。生成的 sanitizer 配置如下所示。
const sanitizer = new Sanitizer({});
/*
{
"attributes": [],
"comments": true,
"dataAttributes": true,
"elements": [],
"removeAttributes": [],
"removeElements": [],
"replaceWithChildrenElements": []
}
*/
创建“允许” sanitizer
此示例演示了如何创建一个“允许” sanitizer:一种只允许部分属性和元素的 sanitizer。
代码首先使用 Sanitizer() 构造函数创建一个 Sanitizer,并指定一个 SanitizerConfig,该配置允许 <div>、<p> 和 <script> 元素。
然后,示例使用 allowElement() 进一步允许 <span> 元素,使用 allowAttribute() 允许任何元素上的 id 属性,并使用 replaceElementWithChildren() 方法将任何 <b> 元素替换为其内部内容(这是一种“允许”,因为您明确指定了要保留的某些实体)。最后,我们指定保留注释。
const sanitizer = new Sanitizer({ elements: ["div", "p", "script"] });
sanitizer.allowElement("span");
sanitizer.allowAttribute("id");
sanitizer.replaceElementWithChildren("b");
sanitizer.setComments(true);
创建“移除” sanitizer
此示例演示了如何创建一个“移除” sanitizer,指定要从输入中移除的项目。
代码首先使用 Sanitizer() 构造函数创建一个 Sanitizer,并指定一个 SanitizerConfig,该配置会移除 <span> 和 <script> 元素。然后,我们使用 removeElement() 将 <h6> 添加到要移除的元素列表中,并使用 removeAttribute() 从属性列表中移除 lang。我们还移除了注释。
const sanitizer = new Sanitizer({ removeElements: ["span", "script"] });
sanitizer.removeElement("h6");
sanitizer.removeAttribute("lang");
sanitizer.setComments(false);
规范
| 规范 |
|---|
| HTML Sanitizer API # sanitizer |
浏览器兼容性
加载中…