拒绝加载图像“blob:...”，因为它违反了以下内容安全策略

Question

我收到此错误：

 Refused to load the image 'blob:file:///cf368042-bf23-42b6-b07c-54189d3b0e01' because it violates the following Content Security Policy directive: "default-src * 'self' 'unsafe-inline' 'unsafe-eval' data: gap: content:". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.

在尝试加载 mapboxGL 地图时。这是我的 CSP 标签：

 <meta http-equiv="Content-Security-Policy"
    content="
      worker-src blob:;
      child-src blob: gap:;
      default-src * 'self' 'unsafe-inline' 'unsafe-eval' data: gap: content:">

原文由 Raz Buchnik 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

这是图像和 base64 的修复。

需要添加 img-src 'self' blob: data:; 如下：

 <meta http-equiv="Content-Security-Policy"
    content="
      worker-src blob:;
      child-src blob: gap:;
      img-src 'self' blob: data:;
      default-src * 'self' 'unsafe-inline' 'unsafe-eval' data: gap: content:">

原文由 Raz Buchnik 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

您需要添加 img-src blob: 在您的 CSP 值中。由于 img-src 不存在，因此它使用 default-src。您也可以设置 img-src *。请查看 https://content-security-policy.com/ 以检查如何为图像添加 CSP。

原文由 Trupti J 发布，翻译遵循 CC BY-SA 4.0 许可协议