dompurify本身不保证代码质量，必须依赖白名单配置、服务端二次净化和uri协议校验三者协同；allowed_tags需精简至业务必需标签（如['p','br','strong','em','a','ul','ol','li','code']），禁用object、embed、svg等潜在危险标签，forbid_tags仅为冗余保险，allowed_attr须严格控制且必须配合allowed_uri_regexp（如/^(https?|ftp|mailto):/i）拦截javascript:、data:等协议，node.js环境需jsdom模拟dom并禁用脚本执行，前端净化不可替代后端净化，v-html/dangerouslysetinnerhtml渲染前必须调用sanitize()，且仅在submit、入库、渲染三个可信时机执行。
DOMPurify 本身不保证代码质量，它只负责过滤 XSS 风险；所谓“代码质量”必须靠白名单配置 + 服务端二次净化 + URI 协议校验三者共同约束，缺一不可。
为什么 ALLOWED_TAGS 白名单必须手动精简
默认配置允许约 30 个标签，但其中 style、script、iframe 等已被禁用，真正危险的是那些看似无害却可被利用的标签——比如 object、embed、math、svg。它们在特定上下文中仍可能触发执行逻辑或加载远程资源。
- 只放你业务真需要的：例如博客评论只需
['p','br','strong','em','a','ul','ol','li','code']，连div都不该放（语义混乱且易藏 style） -
FORBID_TAGS是冗余保险，不是替代项；漏掉svg就可能被绕过，尤其配合onload或href="data:text/html,..." - 不要信编辑器“输出安全 HTML”的说法：Quill 的
root.innerHTML、TinyMCE 的getContent()都是原始输入，没经过任何净化
ALLOWED_ATTR 和 URI 协议校验必须显式配全
光列 href 和 src 不够，攻击者会用 href="javascript:alert(1)" 或 src="data:text/html;base64,..." 绕过。DOMPurify 默认不校验协议，ALLOWED_URI_REGEXP 必须手写。
- 强制限制协议：
ALLOWED_URI_REGEXP: /^(https?|ftp|mailto):/i，排除javascript:、data:、vbscript: -
ALLOWED_ATTR要严格到“没列就不许存在”：别加style和class，除非你有完整策略（如只允class="text-sm font-bold"这类 Tailwind 类名） - 链接自动补
rel="noopener"得靠 hook：DOMPurify.addHook("afterSanitizeAttributes", node => { if (node.tagName === "A" && node.hasAttribute("target")) node.setAttribute("rel", "noopener"); })
Node.js 环境调用 DOMPurify 必须配 jsdom
直接 require('dompurify') 在服务端会报 ReferenceError: window is not defined，因为 DOMPurify 依赖浏览器 DOM API。
- 安装：
npm install jsdom - 初始化时禁用脚本：
const dom = new JSDOM('', { runScripts: 'dangerously' })是测试专用，生产必须设为false或不传 - 再用
createDOMPurify(dom.window)获取净化器，否则sanitize()不生效 - 前端 import 就能用，但千万别以为“前端净化了就安全了”——攻击者 curl 直 POST，后端不净化等于裸奔
v-html 或 dangerouslySetInnerHTML 渲染前必须走 sanitize()
Vue 的 v-html 和 React 的 dangerouslySetInnerHTML 完全不做过滤，它们只是把字符串原样塞进 innerHTML。哪怕你刚用 DOMPurify 处理过，变量来源也必须可信。
- 不要在
computed或watch里反复调用sanitize()：性能差、光标跳、样式丢，且对注释包裹的 payload（如<!--<script>-->alert(1)）无效 - 正确时机只有三个：表单 submit 前、服务端入库前、前端渲染前；三者都要做，但后端是唯一可信环节
- 别信
vue-dompurify-html这类指令封装——它只是帮你省了一行sanitize()调用，配置错误照样 XSS
最容易被忽略的点：DOMPurify 不处理 malformed HTML 的容错问题，也不修复闭合错误；如果用户粘贴一段带未闭合 div 的富文本，净化后可能破坏布局——这不是 bug，是设计使然。你要么接受它，要么在前端用 DOMPurify.sanitize() 后再用 DOMParser 检查结构合法性，但这已是另一层工程权衡了。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
