内容安全策略阻止远程 CSS 背景图像

Question

我的 CSP 使用消息阻止了从远程服务器加载的背景图像

内容安全策略：页面的设置阻止了自身资源的加载（“default-src * https://xxxxx.com ”）。来源：背景图片：url(' https://xxxxx ....

这是我的 CSP：

<meta http-equiv="Content-Security-Policy" content="default-src * https://xxxxx.com; script-src * 'unsafe-eval' 'unsafe-inline'; img-src 'self' data:">

...xxxxx显然我的域在哪里。

我认为它不喜欢url(...，但CSP 规范似乎没有考虑url()一个方案，所以我不知道该怎么做。有人知道吗？

[更新]

在@sideshowbarker 的评论之后，我应该指出这个调用来自一个内联style属性（不是标签）。

Answer 1

该 CSP 违规消息表明您有内联 CSS 样式内容，因此您必须将该 CSS 内容移动到一个单独的文件（并使用一个link元素来引用它），或者您必须指定'unsafe-inline'——例如，通过向style-src您的策略添加指令：

<meta http-equiv="Content-Security-Policy"
  content="default-src * https://xxxxx.com;
  script-src * 'unsafe-eval' 'unsafe-inline';
  style-src 'self' 'unsafe-inline';
  img-src 'self' https://xxxxx.com data:">

原因是，问题中引用的 CSP 违规消息并不是说该 CSS 样式内容中的图像是问题——它只是说您有一些内联样式内容，句号。

就 CSP 而言，内联样式内容是什么并不重要——只是您现有的 CSP 策略不允许任何内联样式内容；您现有的策略只允许内联脚本，因为它script-src是您指定的唯一指令'unsafe-inline'。

因此，如果您要保留该内联样式内容，则必须使用'unsafe-inline'它来允许它。

更新：根据下面的评论，似乎在这种情况下'unsafe-inline'添加了一次for style-src，也有必要添加https://xxxxx.comfor img-src。

尽管如此，一旦您最终指定'unsafe-inline'了样式内容和脚本，您似乎就需要开始考虑是否要指定 CSP 策略——因为允许所有内容内联有点违背了制定 CSP 政策的初衷。

如果您的目标是降低 XSS 风险，那么您似乎应该考虑将所有内联样式/脚本内容移动到单独的文件中，并使用<script src>和link引用它们……