使用 setHTML() 方法消毒HTML

💡 原文中文,约4900字,阅读约需12分钟。
📝

内容提要

setHTML() 方法安全处理和注入 HTML 字符串,有效防止跨站脚本攻击。它解析并清理输入的 HTML,移除不安全的元素和属性,并可通过自定义配置选择允许或移除的元素。相比直接使用 innerHTML,更加安全。

🎯

关键要点

  • setHTML() 方法安全处理和注入 HTML 字符串,有效防止跨站脚本攻击。
  • 该方法解析并清理输入的 HTML,移除不安全的元素和属性。
  • 可以通过自定义配置选择允许或移除的元素。
  • setHTML() 方法比直接使用 innerHTML 更加安全。
  • setHTML() 方法返回值为 None (undefined)。
  • 当 options.sanitizer 接收非规范化的 SanitizerConfig 时,会抛出 TypeError 异常。
  • setHTML() 会移除无效的元素和不符合清理程序配置的 HTML 实体。
  • 使用 setHTML() 替代 Element.innerHTML 来插入不可信的 HTML 字符串。
  • 即使净化器配置允许不安全选项,setHTML() 仍会移除这些元素。
  • 示例展示了使用 setHTML() 对 HTML 字符串进行安全处理和注入的几种方式。

延伸问答

setHTML() 方法的主要功能是什么?

setHTML() 方法用于安全处理和注入 HTML 字符串,有效防止跨站脚本攻击。

使用 setHTML() 方法有什么安全优势?

setHTML() 方法解析并清理输入的 HTML,移除不安全的元素和属性,比直接使用 innerHTML 更加安全。

setHTML() 方法如何处理不安全的 HTML 元素?

setHTML() 会移除无效的元素和不符合清理程序配置的 HTML 实体,确保没有 XSS 风险的元素或属性。

setHTML() 方法的返回值是什么?

setHTML() 方法的返回值为 None (undefined)。

如何自定义 setHTML() 方法的净化器配置?

可以通过 options 参数中的 sanitizer 属性传入自定义的 Sanitizer 或 SanitizerConfig 对象,选择允许或移除的元素。

使用 setHTML() 方法时会抛出什么异常?

当 options.sanitizer 接收非规范化的 SanitizerConfig 时,会抛出 TypeError 异常。

➡️

继续阅读