Day366:什么是 CSP?

[Genzhen]

每日一题会在下午四点在交流群集中讨论，五点小程序中更新答案
欢迎大家在下方发表自己的优质见解

二维码加载失败可点击 小程序二维码

扫描下方二维码，收藏关注，及时获取答案以及详细解析，同时可解锁800+道前端面试题。

---

内容安全策略(CSP)

CSP 本质上就是建立白名单，开发者明确告诉浏览器哪些外部资源可以加载和执行。我们只需要配置规则，如何拦截是由浏览器自己实现的。我们可以通过这种方式来尽量减少 XSS 攻击。

通常有两种方式来开启 CSP

• 一种是设置 HTTP 首部中的 Content-Security-Policy
• 一种是设置 meta 标签的方式 <meta http-equiv="Content-Security-Policy">

这里以设置 HTTP Header 来举例

• 只允许加载本站资源

Content-Security-Policy:default-src 'self'

• 只允许加载 HTTPS 协议图片

Content-Security-Policy: img-src https://*

• 允许加载任何来源框架

Content-Security-Policy: child-src 'none'

设置的属性还有很多，更多设置属性可以查看 MDN 文档。

对于这种方式来说，只要开发者配置了正确的规则，那么即使网站存在漏洞，攻击者也不能执行它的攻击代码，并且 CSP 的兼容性也不错。