Content Security Policy 报告与子资源完整性(SRI)实践

---

title: Content Security Policy 报告与子资源完整性(SRI)实践

keywords: Content-Security-Policy, report-uri, report-to, default-src, script-src,

SRI integrity

description: 通过 CSP 报告与子资源完整性强化前端资源加载安全，限制来源并收集违规上报，保障混合内容与脚本风险可控。

categories:

• 文章资讯
• 技术教程

---

CSP 头部（含报告）：

Content-Security-Policy: default-src 'self'; img-src 'self' https: data:; script-src 'self' https: 'nonce-abc123'; style-src 'self' https: 'unsafe-inline'; connect-src 'self' https:; report-uri https://report.example.com/csp

使用 Report-To 与 CSP 报告：

Report-To: {"group":"csp","max_age":10800,"endpoints":[{"url":"https://report.example.com/reports"}]}
Content-Security-Policy: default-src 'self'; report-to csp

页面内 nonce 与 SRI 示例：

<meta http-equiv="Content-Security-Policy" content="script-src 'self' https: 'nonce-abc123';">
<script nonce="abc123">console.log('secure')</script>
<script src="https://cdn.example.com/app.min.js" integrity="sha256-BASE64_SHA256_HASH" crossorigin="anonymous"></script>

Nginx 设置 CSP 与报告：

add_header Content-Security-Policy "default-src 'self'; script-src 'self' https: 'nonce-abc123'; report-uri https://report.example.com/csp" always;
add_header Report-To '{"group":"csp","max_age":10800,"endpoints":[{"url":"https://report.example.com/reports"}]}' always;