如何通过允许所有内容来通过 CSP（内容安全策略）？

Question

该网站在本地机器上运行完美，但是当我将它上传到 netlify 时它下降到 20 errors。

我只想与朋友分享我的第一个项目，现在不想担心安全问题。

已尝试实现此 Allow All Content Security Policy? post 中的所有答案，但仍然一无所获。

这是我的 header 出现了前面提到的 20 个错误：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="Content-Security-Policy" content="
      default-src *  data: blob: filesystem: about: ws: wss: 'unsafe-inline' 'unsafe-eval' 'unsafe-dynamic'; 
      script-src * data: blob: 'unsafe-inline' 'unsafe-eval'; 
      connect-src * data: blob: 'unsafe-inline'; 
      img-src * data: blob: 'unsafe-inline'; 
      frame-src * data: blob: ; 
      style-src * data: blob: 'unsafe-inline';
      font-src * data: blob: 'unsafe-inline';">
    <link rel="stylesheet" href="css/main.css">

但尝试所有其他答案也得到了类似的结果。

Answer 1

最初您有一个通过 HTTP header 发布的 CSP，此 CSP 具有特征 script-src-elem 'none' 规则（在打印屏幕中以蓝色下划线显示）。
您通过元标记添加了 CSP，此 CSP 具有特征 'unsafe-dynamic' 令牌（在打印屏幕中以绿色下划线显示）。

您不能通过添加第二个内容安全策略来放宽第一个内容安全策略。

就像 sideshowbarker 的评论一样，只需删除 HTTP 中的 CSP header。检查您是否安装了 netlify-plugin-csp-generator 或 netlify-plugin-csp-headers Netlify packages。那些可以通过 HTTP header.

发布默认 CSP

Answer 2

我最近也遇到了同样的情况，您可能有一个阻止脚本的浏览器扩展程序运行。

这就是为什么您甚至可能无法在 google 开发工具中看到这些 headers。

为该站点禁用它，瞧 ;)

如何通过允许所有内容来通过 CSP（内容安全策略）？

How to get past CSP (Content Security Policy) by allowing everything?

html

deployment

content-security-policy

netlify