前端安全之内容安全策略（CSP）进阶配置与绕过防御详解

1. CSP的基本概念与作用

内容安全策略（CSP） 是一种通过HTTP响应头（如 Content-Security-Policy）定义的安全机制，用于限制页面可以加载或执行的资源（如脚本、样式、图片等），从而有效缓解XSS、数据注入等攻击。其核心思想是白名单机制：开发者明确指定哪些来源的资源是可信的，浏览器会拒绝违反策略的资源加载或执行。

2. CSP的常见指令与配置示例

CSP通过指令控制不同类型的资源，常见指令包括：

• default-src：默认策略（适用于未单独指定的资源类型）；
• script-src：控制JavaScript的加载与执行；
• style-src：控制样式表；
• img-src：控制图片资源；
• connect-src：限制XHR、WebSocket等连接的目标地址；
• font-src：控制字体文件；
• object-src：控制<object>、<embed>等插件资源；
• frame-src：控制iframe嵌入（已废弃，改用child-src或直接使用frame-src）；
• report-uri（或report-to）：指定违规报告发送的地址。

示例配置：

Content-Security-Policy: script-src 'self' https://trusted.cdn.com; style-src 'self'; img-src *; default-src 'none';  

• 仅允许同源脚本和https://trusted.cdn.com的脚本；
• 样式仅允许同源；
• 图片允许任何来源（*）；
• 其他资源默认禁止（'none'）。

3. CSP的高级特性与关键字

（1）特殊关键字

• 'self'：仅允许同源资源；
• 'none'：禁止所有资源；
• 'unsafe-inline'：允许内联脚本/样式（如<script>alert(1)</script>，削弱安全性）；
• 'unsafe-eval'：允许eval()、setTimeout(string)等动态代码执行；
• 'nonce-<value>'：通过随机数允许特定内联脚本，例如：

  <script nonce="abc123">alert("Allowed")</script>  
  

  CSP头需包含 script-src 'nonce-abc123'。
• 'sha256-<hash>'：允许哈希值匹配的内联脚本/样式，例如：

  <script>alert("Hello")</script>  
  

  计算其SHA256哈希值后，CSP头配置为 script-src 'sha256-qznLcsROx4GACP2dm0UCKCzCG+HiZ1guq6ZZDob/Tng='。

（2）严格模式配置

为最大化防御XSS，推荐配置：

Content-Security-Policy: default-src 'self'; script-src 'self' 'nonce-{RANDOM}'; object-src 'none'; base-uri 'self';  

• 禁止插件（object-src 'none'）防止Flash等攻击；
• 限制<base>标签的URL（base-uri）避免路径劫持。

4. CSP的绕过方法与防御加固

（1）常见绕过场景

1. JSONP端点误信任：
   若配置包含 script-src 'self' https://api.example.com，而api.example.com提供JSONP回调功能，攻击者可利用JSONP执行恶意代码：

   <script src="https://api.example.com/search?callback=alert(1)"></script>  
   

   防御：审核白名单域名是否包含动态脚本执行功能。

2. 重定向漏洞
   若img-src允许任意域名，但某白名单域名（如cdn.example.com）存在开放重定向漏洞，攻击者可通过重定向到data:协议执行代码：

   <img src="https://cdn.example.com/redirect?url=data:text/html,<script>alert(1)</script>">  
   

   防御：限制重定向行为或使用strict-dynamic关键字。

3. CSP解析差异
   浏览器对CSP解析可能存在差异，例如旧版本忽略default-src对脚本的约束。

（2）加固策略

• 使用strict-dynamic关键字：

  script-src 'nonce-{RANDOM}' 'strict-dynamic';  
  

  该关键字允许通过非动态加载的脚本（如通过nonce验证的脚本）进一步加载其他脚本，同时禁止内联脚本和静态白名单，更适合现代应用。
• 启用upgrade-insecure-requests：自动将HTTP资源升级为HTTPS；
• 通过Content-Security-Policy-Report-Only模式监控策略违规，逐步调整策略。

5. 实际部署与调试流程

1. 逐步部署：

   • 先使用 Content-Security-Policy-Report-Only 头收集违规报告；
   • 分析报告并调整策略，确保正常功能不受影响；
   • 切换为强制模式（Content-Security-Policy）。

2. 调试工具：

   • 浏览器开发者工具的Console标签会显示CSP违规信息；
   • Network标签可观察资源是否被阻止；
   • 使用在线工具（如CSP Evaluator）检测策略配置风险。

6. 总结

CSP是纵深防御的重要环节，但其有效性依赖于严谨的白名单管理和对绕过手法的认知。通过结合nonce、strict-dynamic等现代特性，并定期审计资源加载路径，可显著提升前端安全性。