CSP Nonce 与 Strict-Dynamic 实战（脚本信任链与验证）

---

title: CSP Nonce 与 Strict-Dynamic 实战（脚本信任链与验证）

date: 2025-11-26

keywords:

• CSP
• nonce
• strict-dynamic
• 资源策略
• 验证

description: 使用CSP的nonce与strict-dynamic构建脚本信任链，避免内联与不可信脚本执行，提供服务端生成与浏览器验证的可落地方案。

categories:

• 文章资讯
• 技术教程

---

概述

strict-dynamic 允许由可信脚本动态加载的脚本继承信任，配合随机 nonce 可替代来源白名单并提升安全性。该策略防止非预期脚本执行并简化第三方脚本管理。

关键实践与参数

• 头部策略: Content-Security-Policy: script-src 'nonce-<random>' 'strict-dynamic' https:; object-src 'none'
• 随机nonce: 每请求生成不可预测字符串
• 动态加载: 仅从带nonce的根脚本引入下游脚本
• 监控与报告: 使用 report-to/report-uri

示例/配置/实现

// Node服务端生成nonce并注入
import crypto from 'crypto'
function genNonce() { return crypto.randomBytes(16).toString('base64') }
app.use((req, res, next) => {
  const nonce = genNonce()
  res.setHeader('Content-Security-Policy', `script-src 'nonce-${nonce}' 'strict-dynamic' https:; object-src 'none'`)
  res.locals.nonce = nonce
  next()
})

<script nonce="{{nonce}}">/* bootstrap可信脚本 */</script>

// 可信脚本中动态加载
const s = document.createElement('script')
s.src = 'https://cdn.example.com/app.js'
document.head.appendChild(s)

验证

• 非可信拦截: 未带nonce的内联脚本与插入的脚本被拒绝
• 信任链: 由带nonce脚本加载的下游脚本正常执行
• 报告: 违规事件通过CSP报告端点可见
• 兼容性: 在现代浏览器上工作, 旧版需回退策略

注意事项

• 每请求生成唯一nonce, 禁止复用
• 移除 'unsafe-inline' 与广泛白名单
• 第三方脚本需通过可信引导加载
• 搭配COOP/COEP与Permissions-Policy协同治理