内容安全策略(CSP)通过限制脚本执行来源提升Web应用安全性,主要控制内联脚本、外部脚本域名、动态代码执行等行为;推荐使用nonce或hash机制授权内联脚本,避免unsafe-inline和unsafe-eval,结合strict-dynamic支持现代框架,并利用Report-Only模式调试策略,有效降低XSS风险。

内容安全策略(Content Security Policy,简称 CSP)是一种重要的安全机制,用于防止跨站脚本(XSS)、数据注入等攻击。在使用 JavaScript 的 Web 应用中,合理配置 CSP 能有效限制哪些脚本可以执行,从而提升应用的安全性。
理解 CSP 的基本作用
CSP 通过 HTTP 响应头 Content-Security-Policy 来定义浏览器可以加载和执行的资源来源。对于 JavaScript,主要控制以下几类行为:
- 内联脚本(如 onclick、)是否允许执行
- 外部脚本文件的加载域名限制
- eval()、setTimeout(string) 等动态代码执行是否被禁止
- 内联样式与事件处理器的使用限制
默认情况下,CSP 会阻止所有不明确允许的资源加载和执行行为。
常见 CSP 配置指令(针对 JavaScript)
以下是与 JavaScript 相关的关键 CSP 指令及其含义:
立即学习“Java免费学习笔记(深入)”;
- script-src 'self':只允许加载同源的脚本
- script-src 'unsafe-inline':允许内联脚本(不推荐,降低安全性)
- script-src 'unsafe-eval':允许使用 eval() 执行代码(应避免)
- script-src https://cdn.example.com:允许从指定 HTTPS 域名加载脚本
- script-src 'nonce-abc123':仅允许带有特定 nonce 值的脚本执行
- script-src 'strict-dynamic':信任由已授权脚本动态创建的脚本
示例响应头:
Content-Security-Policy: script-src 'self' 'nonce-abc123'; object-src 'none'; base-uri 'self';
该策略禁止插件、限制脚本仅来自自身域或具有正确 nonce 的标签。
如何安全地使用内联脚本
直接使用内联脚本(如 )通常被 CSP 阻止。若必须使用,可通过以下方式安全授权:
安装教程: 1.将解压包文件全部解压到根目录 2.运行 您的域名/install 3.登录后台 您的域名/dede(帐号密码全为admin) 4.系统-数据库备份/还原-还原全部数据 5.设置系统基本参数 6.清理缓存 7.生成全部 (注:以上步骤不可以省略或者更改顺序) 修改教程: index 主页文件 head 头部文件 footer 底部文件 list 列表文件 article 内容文件
- 使用 nonce:为每个请求生成唯一随机值,并在 script 标签中声明
服务端设置:
// Node.js 示例
const nonce = crypto.randomBytes(16).toString('hex');
res.setHeader("Content-Security-Policy", `script-src 'nonce-${nonce}'`);
HTML 中使用:
- 使用 hash:计算脚本内容的哈希并加入策略
例如,脚本内容为 alert('Hello'),其 SHA-256 哈希为:
sha256-qznLcsROx4GACP2dm0UCKCzCG+HiZ1guq6ZZDob/Tng=
则策略可写为:
script-src 'sha256-qznLcsROx4GACP2dm0UCKCzCG+HiZ1guq6ZZDob/Tng='
开发与部署建议
- 尽量避免使用 'unsafe-inline' 和 'unsafe-eval'
- 优先使用外部脚本文件 + nonce 或 hash 控制
- 结合 strict-dynamic 提高现代应用兼容性(尤其适用于 React、Vue 等框架)
- 上线前使用报告模式收集违规信息:
Content-Security-Policy-Report-Only: script-src 'self'; report-uri /csp-report-endpoint
此头不会阻止行为,但会向指定地址发送违规日志,便于调试。
基本上就这些。合理配置 CSP 能大幅减少 XSS 风险,关键是平衡安全性与功能需求。









