Content-Security-Policy: img-src 'self' https: data:; 

我会大声读出来，因为“图像可以从当前域或任何https://url加载，或者是data://url”。

因此，https:基本上意味着可以通过引用从任何 3rd 方网站加载图像。在这个时代，这基本上就是所有网站。所以这有点违背了首先有这个指令的目的。

data:有点微妙；如果您想将图像直接嵌入到 HTML 文档中，则需要这样做；即，您不希望页面进行外部 GET 来获取图像。W3Docs 给出了这个例子，它是一个 5x5 像素红点的数据。

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4
  //8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />

嵌入任何合理大小的图像都会大得多，例如这是我的 StackExchange 头像 （一些随机站点，不确定此链接是否会在某个时候失效）。

再说一遍，允许data:有点违背了这个 CSP 指令的全部意义。

CSP：img-src 的意义何在？

Content-Security-Policy 通常被视为对抗 XSS 的第二道防线；假设攻击者在您的 UI 中发现了一个错误，该错误使他们可以将任意 javascript 注入用户加载的页面；在您的页面上拥有严格的 CSP 可以将恶意 javascript 可以做的事情沙箱化。

我认为该img-src指令的重点是防止：

• 网站污损：将不专业的图像嵌入到您的页面中，导致网络钓鱼或以其他方式损坏您的网站。
• 利用客户端图像解析器中的漏洞。例如，在历史上，Android 媒体解析器中存在缓冲区溢出，攻击者可能会在您的网页上嵌入精心制作的 jpeg，以接管用户的设备。

您必须自己决定您网站的合法功能是否需要 UI 客户端能够从任意 https URL 加载图像，或直接嵌入数据：编码图像，但如果您不这样做，那么您可能应该取出那些 CSP 指令，以最大限度地提高您从 CSP 获得的保护。

从CSP 的这个文档中：

<scheme-source>
一种方案，例如 http: 或 https:。冒号是必需的。与下面的其他值不同，不应使用单引号。您还可以指定数据方案（不推荐）。

• 数据：允许将数据：URI 用作内容源。这是不安全的；攻击者还可以注入任意数据：URI。谨慎使用它，绝对不要用于脚本。
• ...

至于data:文档已经很清楚的问题。http:是普通的 HTTP，容易受到中间人攻击，这可能会改变内容并以这种方式引入攻击。https:取而代之的是HTTPS，即与服务器进行端到端通信，防止嗅探和操纵。