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

Refused to load the script because it violates the following Content Security Policy directive

当我尝试将我的应用程序部署到 Android 系统高于 5.0.0 (Lollipop) 的设备上时,我不断收到这些类型的错误消息:

07-03 18:39:21.621: D/SystemWebChromeClient(9132): file:///android_asset/www/index.html: Line 0 : Refused to load the script 'http://xxxxx' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' 'unsafe-inline'". 07-03 18:39:21.621: I/chromium(9132): [INFO:CONSOLE(0)] "Refused to load the script 'http://xxx' because it violates the following Content Security Policy directive: "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 *">

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

已解决:

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

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';** ">

不再有错误!

要对此进行详细说明,请添加

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 *">

修正错误。

我们使用了这个:

<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'">

对于任何想要完整解释的人,我建议您查看内容安全策略:https://www.html5rocks.com/en/tutorials/security/content-security-policy/

"Code from https://mybank.com should only have access to https://mybank.com’s data, and https://evil.example.com should certainly never be allowed access. Each origin is kept isolated from the rest of the web"

XSS 攻击基于浏览器无法区分您的应用程序代码与从其他网站下载的代码。因此,您必须使用 Content-Security-Policy HTTP header.

将您认为可以安全下载内容的内容来源列入白名单。

此策略使用一系列策略指令进行描述,每个策略指令描述特定资源类型或策略区域的策略。您的策略应包含一个 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' 会带来安全问题,因此除非您有非常特殊的需要,否则不应使用它们:

"If eval and its text-to-JavaScript brethren are completely essential to your application, you can enable them by adding 'unsafe-eval' as an allowed source in a script-src directive. But, again, please don’t. Banning the ability to execute strings makes it much more difficult for an attacker to execute unauthorized code on your site." (Mike West, Google)

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

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

如何在 ngnix 中关闭它

  • 默认情况下,ngnix ssl.conf 文件将在响应中添加一个 header:

    #> 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,它不应该将 header 添加到响应中。

If you are concerned about security or in production please do not follow this, use these steps as only for testing purpose and moving on.

完整权限字符串

前面的回答都没有解决我的问题,因为他们没有同时包含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 应用程序。

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

因此,当您 Git 推送 Heroku master 时,您引用的构建文件夹不会推送到 Heroku。这就是它显示此错误的原因。

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

对于像我这样使用 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>

如果您使用的是头盔包,则只需将 contentSecurityPolicy: false 传递到头盔函数选项中,如下所示

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