XSS（跨站脚本攻击）
适配 2025 年浏览器与框架生态，涵盖存储型、反射型、DOM 型 XSS 及最新防护手段（CSP Level 3、Trusted Types、框架默认防护、AI Prompt Injection 关联风险）。
基本概念
跨站脚本（Cross-Site Scripting，XSS）属于代码注入漏洞。攻击者将恶意脚本注入目标页面，当受害者加载页面时脚本执行，从而窃取 Cookie、Token、浏览器信息，或冒充用户执行敏感操作。
<div id="app">此处是展示区！</div>
<!-- 若未过滤下一行，浏览器会执行脚本 -->
<script>alert('Hello! I am Iron Man')</script>
html
常见危害
- 盗取 Cookie、LocalStorage、Session Token
- 劫持账号、读写 DOM、发起代替操作
- 植入钓鱼页面、键盘记录、恶意广告
- 对后台管理者实施提权攻击、执行 CSRF
- 在 AI 场景中注入 Prompt，窃取上下文或误导输出（Prompt Injection）
攻击类型
1. 存储型（Stored XSS）
恶意脚本持久化在数据库、缓存或日志中，当其他用户访问相关内容时触发。常见于留言、评论、工单系统。
2. 反射型（Reflected XSS）
脚本放在 URL 或 POST 数据中，服务端原样返回页面。需通过钓鱼链接诱导用户点击。
3. DOM 型（DOM XSS）
恶意代码在前端执行时被拼接到 DOM 中并执行，与服务端无关。通常由于 innerHTML、document.write、eval 等不安全操作导致。
4. 混合型/变种
- 基于 JSONP、CORS 的 XSS：第三方接口返回可执行脚本
- 基于模板注入：Mustache/Handlebars 等模板未安全使用
- 基于文件上传：图片或 SVG 内嵌脚本
- Prompt Injection：通过用户输入影响 LLM 输出，诱导泄露 Token/API 密钥
防御策略
1. 输入净化 + 输出编码
- 对用户输入执行白名单验证（允许内容）或黑名单过滤（转义危险字符）。
- 输出到不同上下文时使用合适编码：HTML (
<)、属性、URL、JavaScript。 - 推荐使用开源库：DOMPurify、xss-filters、OWASP Java Encoder。
2. 使用现代框架的默认防护
- Vue/React/Angular/Svelte 默认会对表达式输出进行编码。
- 避免使用
v-html、dangerouslySetInnerHTML等直接渲染接口；若必须使用，结合 DOMPurify。 - Next.js/Nuxt.js 等 SSR 框架遵循安全编码，但自定义渲染需要额外注意。
3. Content Security Policy（CSP）
Content-Security-Policy: default-src 'self'; script-src 'self' https://trusted.cdn.com; object-src 'none'; base-uri 'self'; frame-ancestors 'none'; report-to default;
http
script-src 'self' 'nonce-<random>'：限制脚本来源并使用 nonce。report-uri/report-to：收集 CSP 违规报告。- 配合
meta标签可渐进部署。
4. Trusted Types（Chrome/Edge 支持）
Content-Security-Policy: trusted-types default;
http
- 强制 DOM Sink（如
innerHTML）仅接受 Trusted Types 对象。 - 通过
trustedTypes.createPolicy('default', { createHTML: sanitize })定义策略。
5. Cookie 与 Session 安全
- 设置
HttpOnly、Secure、SameSite=Lax。 - 采用 Token（JWT/Session Token）+ Storage，避免存储在可被 JS 读取的 Cookie。
- 敏感操作使用一次性 Token 或二次确认。
6. 监控与防护
- 前端异常监控、WAF、CSP 报告结合。
- 基于 SAST/DAST、SonarQube、Snyk、npm audit 等工具检测。
- 对第三方脚本添加 Subresource Integrity (SRI)。
常见误区
- 仅靠正则替换
<script>；应统一使用编码策略。 - 忽视富文本编辑器（需配置白名单、Sanitize）。
- 认为 SPA 框架自带全量防护；DOM XSS 仍可通过
innerHTML触发。 - 未考虑 Prompt Injection：AI 应用需过滤用户输入、对 LLM 输出进行审查。
实战建议
- 对所有用户内容输出进行编码，富文本默认使用白名单过滤（DOMPurify + 可信标签）。
- 启用 CSP + Trusted Types，从监控模式逐步增强。
- 统一封装 API 响应处理层，避免直接操作 DOM。
- 检查第三方 SDK/广告脚本，启用 SRI 并在隔离域提供服务。
- 在 CI/CD 中集成安全扫描，联动渗透测试。
- AI 产品需对 Prompt 输入进行限制，并通过审核管道过滤模型输出。
参考链接
- OWASP XSS Prevention Cheat Sheet
- Google CSP & Trusted Types 指南
- DOMPurify、helmet（Node.js 安全头中间件）
- 《Web 安全攻防实践》《Front-End Security》
提醒：XSS 防护应与 CSRF、点击劫持等策略配合，形成立体防线。保持依赖更新并落地安全响应流程，是长期安全运营的关键。
↑