CSP策略配置详解：提升HTML安全

本文深入解析了如何通过正确配置Content-Security-Policy（CSP）HTTP响应头来从根本上防御XSS攻击——它不是被动修补漏洞，而是让浏览器主动拒绝执行非法脚本；强调必须禁用'unsafe-inline'并结合动态nonce或静态hash机制安全启用内联脚本，同时不可忽视base-uri、form-action、frame-ancestors等关键指令的显式约束，还指出开发阶段务必先使用Report-Only模式采集真实违规行为，避免因策略过严导致白屏，最后明确HTTP头是唯一可靠配置方式，HTML meta标签存在严重局限性和生效延迟风险。

怎么用 Content-Security-Policy 阻止 XSS？

直接加 HTTP 响应头 Content-Security-Policy，比靠 JS 过滤或 HTML 转义更底层、更可靠。它不是“修补漏洞”，而是让浏览器根本不敢执行非法脚本。

常见错误是只写 script-src 'self' 就以为安全了——其实 inline script（比如 ）、eval()、内联事件（onclick="..."）默认全被放行，除非你显式禁止。

• script-src 'self' https://cdn.example.com：只允许同源和指定 CDN 的外部脚本，但依然允许内联脚本
• 要禁内联，必须加 'unsafe-inline' 的反向操作——即不写它，再配合 nonce 或 hash
• 启用 default-src 'none' 后，所有资源类型（img、style、font 等）都需显式声明，否则 404

nonce 和 hash 怎么选？

两者都能合法化特定内联脚本，但机制不同：nonce 是服务端每次响应生成一次随机值，hash 是对脚本内容做 SHA256 摘要。选错会导致脚本白屏或策略失效。

典型误用：把 nonce 值硬编码在 HTML 模板里，或用固定字符串当 nonce——这等于形同虚设，攻击者可复用。

• 用 nonce：HTML 中写 ，响应头配 script-src 'nonce-abc123'；务必每次请求生成新值
• 用 hash：算出 sha256-...，写进头里，如 script-src 'sha256-BzLdO9X...'；适合静态内联脚本，动态拼接的脚本无法预计算 hash
• 别混用：一个策略里同时写 'nonce-xxx' 和 'sha256-...' 是允许的，但浏览器只匹配其一；没匹配上的脚本仍被拦截

为什么开了 CSP 还有资源加载失败？

因为 CSP 默认不继承父页面策略，iframe、worker、fetch 请求等子资源都受各自响应头控制。最常踩的坑是：主页面加了 CSP，但 API 接口返回的 HTML 片段（比如富文本渲染）没带头，或用了 unsafe-inline 却忘了限制 style-src。

另一个隐形问题：CSP 对 base-uri、form-action、frame-ancestors 这些指令默认宽松，不显式配置就可能被利用。

• base-uri 'self' 防止恶意 劫持相对 URL
• form-action 'self' 阻止表单提交到第三方，防 CSRF 数据外泄
• frame-ancestors 'none' 或 'self' 防止被嵌入钓鱼页面（点击劫持）
• 开发时用 Content-Security-Policy-Report-Only 头 + report-uri 先观察违规行为，别一上来就 blocking

HTTP 头 vs 标签配置 CSP 有什么区别？

只有 script-src、style-src、img-src 等少数指令支持 ，且不支持 report-uri、frame-ancestors、base-uri 等关键指令。更重要的是： 在 HTML 解析中途才生效，之前加载的内联脚本已执行。

所以生产环境必须用 HTTP 响应头。仅在无法改服务器配置（如静态托管平台）时，才退而求其次用 ，且得接受策略延迟生效的风险。

• Apache：用 Header set Content-Security-Policy "..."
• Nginx：用 add_header Content-Security-Policy "...";（注意分号）
• Node.js（Express）：用 res.setHeader('Content-Security-Policy', '...')
• 千万别在 里写 report-uri——它会被忽略

真正难的不是写对那几行策略，而是理清每个资源的实际来源路径、是否跨域、是否动态生成。线上策略一旦写死，改错一条就可能大面积白屏，所以先开 Report-Only，盯三天日志再切正式策略。

文中关于的知识介绍，希望对你的学习有所帮助！若是受益匪浅，那就动动鼠标收藏这篇《CSP策略配置详解：提升HTML安全》文章吧，也可关注golang学习网公众号了解相关技术文章。