CSP设置后图片资源被阻止，如何排查？
最近给项目加CSP头时发现图片加载失败，控制台提示”Blocked … source of ‘http://…’ isn’t listed”。我试过在标签用nonce和在CSP头添加，但问题依旧存在。
当前CSP头配置是这样的：
Content-Security-Policy: default-src 'none'; script-src 'self'; style-src 'self'; img-src 'self';
但请求的图片路径明明是相对地址，为什么还是被拦截？另外第三方CDN的图片该怎么正确配置？求大神指点具体排查步骤…
- 1
回答
50浏览
为什么设置了CSP后图片和字体资源还是被阻止了？
我在开发博客项目时配置了CSP头，但图片和字体资源还是被浏览器拦截了。我明明设置了和，控制台报错显示： Refused to load the image 'https://images.exampl...
- 2
回答
59浏览
CSP报显示图片源被阻止但已配置’srcset’还是不行怎么办？
我在开发环境设置了CSP头，但控制台一直报标签的图片被阻止，明明已经在'srcset'里写了self和具体域名，怎么还是不行？ 配置是这样的：Content-Security-Policy: img-...
- 2
回答
93浏览
设置了CSP后图片无法加载，却显示’strict-dynamic’相关错误？
我在给项目配置CSP时遇到了奇怪的问题。设置了后页面报错： <!DOCTYPE html> <html> <head> <meta http-equiv="C...
- 2
回答
39浏览
设置了font-src还是报字体加载被CSP阻止，哪里配置错了？
我在页面里用@font-face引入了自定义字体，同时设置了CSP头"font-src 'self';"。但控制台还是报错： Refused to load the font 'data:applic...
- 1
回答
18浏览
为什么我的CSP策略阻止了eval函数，但移除unsafe-eval又报错？
我在开发动态表单组件时用到了eval执行表达式，CSP报错提示缺少unsafe-eval。尝试在header里加了script-src 'self' 'unsafe-eval'，但控制台还是显示： C...
- 2
回答
24浏览
CSP中的strict-dynamic有什么用？为什么我的动态脚本还是被阻止了？
我在给项目配置CSP时用了'strict-dynamic'，但页面加载时动态创建的script标签还是报blocked错误。比如这样： const script = document.createEl...
- 2
回答
36浏览
为什么我的CSP头配置总是报错？路径和语法都没问题
我在给项目加CSP头的时候遇到奇怪的问题，明明按照文档写了meta标签，但浏览器还是提示违反CSP策略。检查过路径和语法都没问题，这是为什么啊？ 代码是这样写的，设置了script-src只允许sel...
- 2
回答
26浏览
React里用了report-to但CSP报告没收到怎么办？
在React项目里配置了CSP的report-to指令，但一直没收到违规报告，是不是哪里写错了？ 我按照文档设置了meta标签，还用.env文件存了端点： // index.js document.a...
- 2
回答
84浏览
CSP配置报错：Refused to execute inline script because it violates the following Content Security Policy directive
我在给项目添加CSP头时遇到了问题，页面一加载就报错：Refused to execute inline script because it violates the Content Security...
- 2
回答
30浏览
CSP策略配置后为什么还是被绕过执行了内联脚本？
在做渗透测试时，给网站加了CSP策略禁止内联脚本，但测试人员用base64编码的dataURI依然能执行恶意脚本，这是怎么回事？ 我的CSP配置是这样的：Content-Security-Policy...
Content-Security-Policy: default-src 'none'; script-src 'self'; style-src 'self'; img-src 'self' https://your-cdn-domain.com;
第三方CDN图片就在img-src后面追加对应域名，多个用空格隔开。记得清除缓存再测，别问我怎么知道的。就这样。
第一步先打开浏览器开发者工具，看 Network 面板里图片请求的实际响应头是不是真的带上了你设的 CSP。有时候中间件、CDN 或反向代理会覆盖或修改头部，你自己写的策略根本没生效。
第二步检查图片实际请求的域名。比如你以为是 /static/logo.png，但如果页面在 https://a.example.com 下，而图片请求发到了 http://a.example.com（注意是 http），那就算同域名，协议不同也会被 'self' 拦掉。'self' 严格匹配协议+主机+端口。
第三，如果用了内联 data:image 的图片，比如
第四，第三方 CDN 图片的话，在 img-src 后面加上对应域名就行。比如：
注意要用 https，别用 http，除非真要支持 http（不推荐）。也可以临时加 unsafe-eval 和 unsafe-inline 做测试，确认是不是 CSP 导致的问题，但上线前必须去掉。
最后建议开发环境先用 Content-Security-Policy-Report-Only 头来试，收集报错日志而不真正阻断，避免直接干掉正常功能。等报告稳定了再切到正式策略。