拒绝加载脚本，因为它违反了以下内容安全策略指令

Posted 2023-02-19

【中文标题】拒绝加载脚本，因为它违反了以下内容安全策略指令

【英文标题】：Refused to load the script because it violates the following Content Security Policy directive

【发布时间】：2015-09-21 13:32:19

【问题描述】：

当我尝试将我的应用部署到 android 系统高于 5.0.0 (Lollipop) 的设备上时，我不断收到这些错误消息：

07-03 18:39:21.621: D/SystemWebChromeClient(9132): file:///android_asset/www/index.html: 第 0 行：拒绝加载 脚本'http://xxxxx'，因为它违反了以下内容 安全策略指令：“script-src 'self' 'unsafe-eval' '不安全内联'”。07-03 18:39:21.621: I/chromium(9132): [INFO:CONSOLE(0)] "拒绝加载脚本 'http://xxx' 因为它 违反以下内容安全策略指令：“script-src 'self' 'unsafe-eval' 'unsafe-inline'"。

但是，如果我将其部署到 Android 系统为 4.4.x (KitKat) 的移动设备上，则安全策略适用于默认策略：

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

然后我想，也许，我应该改成这样：

<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-eval' 'unsafe-inline'; object-src 'self'; style-src 'self' 'unsafe-inline'; media-src *">

基本上，这两个选项都不适合我。我该如何解决这个问题？

【问题讨论】：

与我的问题非常相似。我无法检索 JSON 文件，“因为它违反了以下内容安全策略指令：“connect-src 'self'””

@MichaelR 如果您想通过 JS 从 API 中检索一些 JSON 信息，例如 tampermonkey 插件或其他所有内容，您可以使用此插件 chrome.google.com/webstore/detail/disable-content-security/… 并在您想要获取某些内容时禁用 CSP 检查。它虽然不安全，但在某些情况下它可能会起作用。我在此处发布此答案是因为我正在寻找我的错误，并且此主题首先在 Google 中显示。

【参考方案1】：

如果您使用的是头盔包，那么只需将 contentSecurityPolicy: false, 传递给这样的头盔功能选项

app.use(
  helmet(
    contentSecurityPolicy: false,
  )
);

【讨论】：

您也可以保留默认设置并添加列入白名单的域：helmet( contentSecurityPolicy: useDefaults: true, directives: 'script-src': ["'self'", "https://whitelisted-domain.com"] )

@MauroAguilar 谢谢我下次试试

【参考方案2】：

对于像我这样使用 Apache/Debian 服务器的傻瓜，他们试图将其添加到 index.html 文件中（并因此损失了几个小时），答案将是这样的：

编辑：/etc/apache2/sites-available/yourwebsiteconfig.com-ssl.conf

添加或修改以下行：

Header always set Content-Security-Policy: "script-src 'self' 'unsafe-inline' 'unsafe-eval' data: https://www.googletagmanager.com"

这里：

<IfModule mod_headers.c>
        Header always append X-Frame-Options SAMEORIGIN
        Header always set Content-Security-Policy: "script-src 'self' 'unsafe-inline' 'unsafe-eval' data: https://www.googletagmanager.com"
</IfModule>

【参考方案3】：

对于任何寻求完整解释的人，我建议您查看内容安全政策：https://www.html5rocks.com/en/tutorials/security/content-security-policy/。

"来自https://mybank.com 的代码只能访问 https://mybank.com 的数据，https://evil.example.com 应该 当然永远不允许访问。每个来源都与 网络的其余部分”

XSS 攻击是基于浏览器无法区分您的应用代码和从其他网站下载的代码。因此，您必须使用Content-Security-Policy HTTP 标头将您认为可以安全下载内容的内容来源列入白名单。

此政策使用一系列政策指令进行描述，每个政策指令都描述了特定资源类型或政策领域的政策。您的策略应该包含一个 default-src 策略指令，这是其他资源类型在没有自己的策略时的备用。

因此，如果您将标签修改为：

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *;**script-src 'self' http://onlineerp.solution.quebec 'unsafe-inline' 'unsafe-eval';** ">

您是说您正在授权执行 javascript 代码 (script-src) 起源于'self'、http://onlineerp.solution.quebec、'unsafe-inline'、'unsafe-eval'。

我猜前两个对您的用例完全有效，我对其他的有点不确定。 'unsafe-line' 和 'unsafe-eval' 存在安全问题，因此除非您对它们有非常特殊的需求，否则不应使用它们：

“如果 eval 和它的 text-to-JavaScript 兄弟是完全必要的 到您的应用程序中，您可以通过添加 'unsafe-eval' 作为 script-src 指令中允许的源。但是，再次，请不要。 禁止执行字符串的能力使其变得更加困难 攻击者可以在您的网站上执行未经授权的代码。”（Mike West，Google）

【讨论】：

为什么在我的本地主机页面中我可以附加另一个主机脚本？

重复使用未托管在您的服务器中但您“信任”的第 3 方脚本的情况并不少见

【参考方案4】：

您收到此错误的可能原因可能是因为您已将 /build 文件夹添加到 .gitignore 文件中，或者通常没有将其检入 Git。

所以当你 Git 推送 Herokumaster 时，你引用的构建文件夹不会被推送到 Heroku。这就是它显示此错误的原因。

这就是它在本地正常工作的原因，但在部署到 Heroku 时却不行。

【参考方案5】：

完整权限字符串

之前的答案没有解决我的问题，因为它们没有同时包含 blob: data: gap: 关键字；所以这是一个字符串：

<meta http-equiv="Content-Security-Policy" content="default-src * self blob: data: gap:; style-src * self 'unsafe-inline' blob: data: gap:; script-src * 'self' 'unsafe-eval' 'unsafe-inline' blob: data: gap:; object-src * 'self' blob: data: gap:; img-src * self 'unsafe-inline' blob: data: gap:; connect-src self * 'unsafe-inline' blob: data: gap:; frame-src * self blob: data: gap:;">

警告：这会使文档暴露在许多漏洞中。请务必防止用户在控制台中执行代码或处于封闭环境中，例如 Cordova 应用程序。

【讨论】：

如果您尝试加载，这是正确的答案，例如控制台中的 JQuery 如下：***.com/a/31912495/137948

我知道这无关，但它并没有解决我的 paypal js sdk 问题，它仍然返回：拒绝将文档的基本 URI 设置为 'paypalobjects.com/web/res/c30/165e8147117bd1483979affdece85' 因为它违反了以下内容安全策略指令：“base-uri 'self' https://*.paypal.com”。

@Thiago 尝试追加;base-uri * self 'unsafe-inline' blob: data: gap:;

虽然允许所有来源违背了此安全功能的目的，但它确实帮助我根据需要设置了正确的来源。

【参考方案6】：

添加元标记以忽略此政策对我们没有帮助，因为我们的网络服务器在响应中注入了 Content-Security-Policy 标头。

在我们的例子中，我们使用 Ngnix 作为 Tomcat 9 基于 Java 的应用程序的 Web 服务器。从网络服务器，它指示浏览器不允许inline scripts，因此为了临时测试，我们通过评论关闭了Content-Security-Policy。

如何在 ngnix 中关闭它

默认情况下，ngnix ssl.conf 文件会在响应中添加一个标头：

#> grep 'Content-Security' -ir /etc/nginx/global/ssl.conf add_header Content-Security-Policy "default-src 'none'; frame-ancestors 'none'; script-src 'self'; img-src 'self'; style-src 'self'; base-uri 'self'; form-action 'self';";

如果你只是评论这一行并重新启动 ngnix，它不应该将标题添加到响应中。

如果您担心安全性或生产过程中的问题，请不要 遵循这一点，将这些步骤仅用于测试目的并继续。

【参考方案7】：

为了详细说明这一点，添加

script-src 'self' http://somedomain 'unsafe-inline' 'unsafe-eval';

像这样的元标记，

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

修正错误。

【参考方案8】：

self answer given by MagngooSasa 成功了，但对于其他试图理解答案的人来说，这里有一些详细信息：

在使用 Visual Studio 开发 Cordova 应用程序时，我尝试导入远程 JavaScript 文件 [位于此处 http://Guess.What.com/MyScript.js]，但出现标题中提到的错误。

这里是meta标签before，在项目的index.html文件中：

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

这里是 更正 元标记，允许导入远程脚本：

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *;**script-src 'self' http://onlineerp.solution.quebec 'unsafe-inline' 'unsafe-eval';** ">

再也没有错误了！

【参考方案9】：

已解决：

script-src 'self' http://xxxx 'unsafe-inline' 'unsafe-eval';

【讨论】：

@dyoser 这是参考developer.chrome.com/extensions/contentSecurityPolicy#relaxing

这通过允许任何恶意插件/xss 注入内联和评估脚本来有效地禁用脚本的 CSP，这完全违背了启用 CSP 的全部目的。

【参考方案10】：

我们使用了这个：

<meta http-equiv="Content-Security-Policy" content="default-src gap://ready file://* *; style-src 'self' http://* https://* 'unsafe-inline'; script-src 'self' http://* https://* 'unsafe-inline' 'unsafe-eval'">

【讨论】：

对于js爱好者：document.getElementsByTagName('head')[0].innerHTML += '<meta http-equiv="Content-Security-Policy" content="default-src gap://ready file://* *; style-src \'self\' http://* https://* \'unsafe-inline\'; script-src \'self\' http://* https://* \'unsafe-inline\' \'unsafe-eval\'">';`