HTML Sanitizer API - 允许开发人员对不受信任的 HTML 字符串进行清理

HTML Sanitizer API 允许开发人员对不受信任的 HTML 字符串进行清理，以便安全地插入到文档的 DOM 中。

Sanitizer API 概念和用法

Web 应用程序通常需要在客户端处理 HTML 字符串，这可能是客户端模板解决方案的一部分，也可能是呈现用户生成的内容的一部分。要以安全的方式进行处理是很困难的。Sanitizer API 允许以安全的方式呈现 HTML。

要访问 API，您将使用构造函数，它创建一个 Sanitizer.Sanitizer 实例，并允许配置允许或不允许的元素和属性列表。

最常见的用例 - 防止 XSS - 由内置的默认列表处理，因此，只有在处理额外的、特定于应用程序的用例时，才有必要用自定义配置创建一个 Sanitizer.Sanitizer。

API 有两种方法来清理字符串。一个返回一个字符串，另一个返回一个文档片段。有关更多信息，请参阅下面的实例部分。

Sanitizer API 接口

Sanitizer

HTML Sanitizer API 的 Sanitizer 接口提供了接受不受信任的 HTML 字符串，并对其进行清理以安全插入到文档的 DOM 中的功能。

实例

此实例显示了使用 Sanitizer.sanitizeToString() 方法清理字符串的结果。返回一个 String 并移除了不允许的 script 和 blink 元素。

// 我们要清理的输入字符串
const stringToClean = '一些<b><i>带有</i></b><blink>标签</blink>的文本，包括一个流氓脚本<script>alert(1)</script>定义。';

const result = new Sanitizer().sanitizeToString(stringToClean);
console.log(result);
// 日志："一些<b><i>带有</i></b>标签的文本，包括一个流氓脚本定义。"

另一种可用的是 Sanitizer.sanitize() 方法。它与上面的非常相似，但是返回一个 DocumentFragment 并删除了不允许的 script 和 blink 元素。

// 我们要清理的输入字符串
const stringToClean = '一些<b><i>带有</i></b><blink>标签</blink>的文本，包括一个流氓脚本<script>alert(1)</script>定义。';

const result = new Sanitizer().sanitize(stringToClean);
// 结果: 一个 DocumentFragment 包含文本节点和一个 <b> 元素，以及一个 <i> 子元素

规范

规范	状态	备注
Unknown sanitizeToString 的定义	Unknown	初始定义。

桌面浏览器兼容性

暂无兼容数据