指南 · 约 3 分钟阅读

部署 Content-Security-Policy,不弄坏你的网站

CSP 告诉浏览器可以信任哪些脚本、样式和图片来源。它是抵御注入脚本和盗卡 skimmer 的最佳防线,部署越谨慎,效果越好。

更新于 · HackGrade

代码和配置保持英文。

1. 从仅报告模式开始

浏览器会在控制台中报告违规,但不会拦截任何内容。

nginx
add_header Content-Security-Policy-Report-Only "default-src 'self'; img-src 'self' data: https:; script-src 'self'; style-src 'self' 'unsafe-inline'; frame-ancestors 'self'; object-src 'none'; base-uri 'self'" always;

2. 浏览网站并查看控制台

在关键页面(首页、商品页、购物车和结账页、联系表单)打开 DevTools → Console。每个被拦截的来源都会显示在那里。把你信任的来源(例如 https://www.googletagmanager.com 或你的支付服务商)加入对应的指令。

3. 强制执行

当控制台不再报错时,把响应头改名为 Content-Security-Policy。在测试更严格的版本时,保留仅报告的响应头与之并存。

.htaccess
Header always set Content-Security-Policy "default-src 'self'; img-src 'self' data: https:; script-src 'self' https://www.googletagmanager.com; style-src 'self' 'unsafe-inline'; frame-ancestors 'self'; object-src 'none'; base-uri 'self'"

WordPress 提示

  • 很多主题和插件使用内联脚本。一开始你可能需要在 script-src 中加入 'unsafe-inline'。这样防护较弱,但 frame-ancestors、object-src 和 base-uri 仍然有用。
  • 要实现严格的策略,请使用 nonce:WordPress 5.7+ 可以为通过 wp_print_inline_script_tag() 输出的脚本添加属性。
  • 先在最关键的结账页上启用严格的 CSP。

常用指令

  • frame-ancestors 'self':X-Frame-Options 的现代替代。
  • upgrade-insecure-requests:自动把 http:// 资源升级为 https://。
  • connect-src:限制脚本可以把数据发送到哪里,对防御 skimmer 很有用。

参考资料

相关指南

免费 · 即时 · 无需注册

抢在别人之前了解你的评级。

被动扫描。未经你的许可,不会进行任何攻击性检测。

免费开始。付费套餐每月 12 美元起,或 29 美元购买单次报告。 查看价格