DOMPurify 3.0.10版本中自定义元素标签匹配的缺陷分析与修复

问题背景

DOMPurify是一个广受欢迎的HTML净化库，用于防止XSS攻击。在3.0.10版本中，其自定义元素标签的匹配逻辑存在一个缺陷，导致包含下划线的自定义元素无法被正确识别。

问题分析

在HTML5规范中，自定义元素名称需要满足特定格式要求：

1. 必须以小写字母开头
2. 必须包含连字符(-)
3. 可以包含字母、数字、连字符(-)、下划线(_)和点号(.)

然而，DOMPurify 3.0.10版本中使用的正则表达式/^[a-z][a-z\d]*(-[a-z\d]+)+$/i存在以下限制：

• 不允许在标签名称中使用下划线(_)和点号(.)
• 强制要求连字符(-)后必须跟随至少一个字母或数字

这种限制与HTML5规范不符，导致像customtag-my-custom-element_v1这样包含下划线的合法自定义元素被错误地拒绝。

技术细节

原始正则表达式分解：

• ^[a-z]：以小写字母开头
• [a-z\d]*：可选的字母或数字
• (-[a-z\d]+)+：一个或多个由连字符开头并跟随至少一个字母/数字的片段
• $/i：不区分大小写

这个表达式的问题在于：

1. 缺少对下划线(_)和点号(.)的支持
2. 连字符后的内容限制过于严格

解决方案讨论

经过社区讨论，提出了几个改进方案：

1. 初步建议：/^[a-z][_a-z\d]*(-_[a-z\d]+)+$/i

   • 添加了对下划线的支持
   • 但仍不够完善

2. 基于规范的完整方案：/^([a-z])([-._a-z\d]*)(\-)([-._a-z\d]*)$/i

   • 完全遵循HTML5规范
   • 但存在正则表达式拒绝服务(ReDoS)风险

3. 最终安全方案：/^[a-z][.\w]*(-[.\w]+)+$/i

   • 使用\w字符类(等价于[a-zA-Z0-9_])
   • 明确包含点号(.)
   • 避免了ReDoS风险
   • 保持了良好的性能

实现意义

这个修复使得DOMPurify能够：

• 正确识别包含下划线的自定义元素
• 保持与HTML5规范的一致性
• 不影响安全性
• 维持良好的性能表现

对于开发者而言，这意味着他们可以在使用DOMPurify时，放心地使用符合规范的各种自定义元素名称，而不用担心被错误地过滤掉。

结论

DOMPurify团队对社区反馈响应迅速，通过这次修复进一步提升了库的兼容性和规范性。这也提醒我们，即使是成熟的安全库，也需要持续关注规范变化和实际使用场景，及时进行调整和完善。