Content Security Policy (CSP) 是一个 Web 安全标准，它可以帮助开发人员防止跨站脚本攻击 (XSS)、数据注入和点击劫持等常见的安全攻击。
为什么需要 CSP？
传统上，Web 应用程序中的 JavaScript 代码和样式表可以从任何来源加载，并且可以动态地插入到页面中。这意味着恶意攻击者可以注入恶意的脚本或样式表，以窃取用户的敏感信息或者进行其他恶意活动。
CSP 允许网站管理员指定哪些内容可以加载到其网站中。使用 CSP，网站管理员可以减少跨站脚本攻击的可能性，提高网站的安全性。
如何实现 CSP？
CSP 通过指定策略来实现，其中包括一组规则，这些规则定义了哪些资源可以在 Web 页面中加载。CSP 策略可以通过 HTTP 头来设置，也可以通过 <meta> 标记来设置。
以下是一个简单的 CSP 策略示例：
Content-Security-Policy: default-src 'self' https://cdn.example.com;
这个策略指定只有来自当前域名和 https://cdn.example.com 的资源才能被加载。
在这里，default-src 是 CSP 中的一个指令。它定义了所有未明确指定规则的资源都需要满足该指令中定义的规则。
CSP 的指令
CSP 支持多种指令，下面是一些常用的指令：
default-src：默认策略。script-src：脚本加载策略。style-src：样式表加载策略。img-src：图像加载策略。connect-src：XHR 和 WebSocket 连接策略。font-src：字体加载策略。object-src：插件加载策略。media-src：音视频加载策略。
每个指令都可以有一个或多个“源”，这些源可以是 URL、域名、IP 地址或者关键字 'self'、'unsafe-inline' 和 'unsafe-eval' 等。
下面是一个更完整的 CSP 策略示例：
Content-Security-Policy: default-src 'none'; script-src 'self' https://cdn.example.com; style-src 'self' 'unsafe-inline' https://cdn.example.com; img-src 'self' data: https://*.example.com; font-src 'self' https://fonts.gstatic.com; object-src 'none'; media-src 'self';
这个策略禁止加载任何资源，除非它们被显式地允许。其中包括：
- 默认情况下不允许从任何源加载任何资源。
- 只允许从当前域名和
https://cdn.example.com加载脚本。 - 允许从当前域名、
data:URL 和所有以.example.com结尾的域名加载图像。 - 只允许从当前域名和
https://fonts.gstatic.com加载字体。 - 不允许加载插件。
- 只允许从当前域名加载音视频。
CSP 的学习与指导意义
使用 CSP 策略可以提高 Web 应用程序的安全性，但同时也可能会影响应用程序的功能和性能。因此，在设置 CSP 策略时，需要权衡安全和功能需求之间的平衡。
以下是一些有用的提示：
- 在开发阶段启用 CSP 报告模式，以便及时发现违规行为
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/38969