内容安全政策：无法在Chrome扩展程序中加载Google API

Question

这是相对于Chrome扩展程序。 我正在尝试使用Google Chart API的简单版本

我在我的html文档“popup.html”中有这个代码，它是在Icon上点击时加载的。

<!doctype html>
<html>
<head>
  <script type="text/javascript" src="js/libs/jquery-1.8.0.min.js"></script>
  <script type="text/javascript" src="js/popup.js"></script>
  <script type="text/javascript" src="http://www.google.com/jsapi?key=xxxxxxxxxxx"></script>

  [...]
</body>
</html>

我收到以下消息：

拒绝加载脚本“http://www.google.com/jsapi?key=xxxxxxxxxxx”，因为它违反了以下内容安全策略指令：“script-src'sself'chrome-extension-resource：”。

我知道它是相对于权限的东西，我试图修改我的Manifest文件，但没有成功：

{
  [...]
  "manifest_version": 2,
  "permissions": ["http://*.google.com/"],
  "content_security_policy": "script-src 'self' http://www.google.com; object-src 'self'",
}

任何的想法？

Answer 1

在过去的12个小时里，我一直在努力解决这个问题，并最终让它发挥作用。 为什么需要这么长时间？ 因为我多次被抛弃了。 首先，假导线：

“使它成为HTTPS” - 无关紧要。 我的Chrome扩展程序现在可以定期对其他域进行HTTP调用，并且运行正常。 （更新：更多澄清。“make it https”神话根植于人们在SCRIPT加载时会遇到的类似问题。如果你需要引入一个外部.js文件，那么是的，你需要修改你的content_security_policy并包含正确的主机名，它似乎只接受https。请记住，这与点击REST服务之类的外部主机名不同。正如我之前所说，这不需要修改content_security_policy，也不需要修改https。）
“在JQuery AJAX调用中使用JSONP” - 这可能是在普通网页中解决跨域AJAX的一种方法，但由于内置的内容安全策略，在chrome扩展中不是必需的。 此外，实现JSONP听起来像PITA，因为它需要服务器端更改来处理回调参数（或者其他东西，我仍然不确定）。 无论如何，没有必要。
“在扩展中使用内容安全策略（CSP）字符串” - 在清单版本2下，默认字符串工作正常：“script-src'self'; object-src'self'”。 您甚至不必明确指定它。 您需要的是将您尝试从扩展名中搜索的域名包含为“权限”值。

解决方案：

从您的扩展程序中删除所有内联JavaScript。 将其放入单独的.js文件中。 我怀疑对于大多数具有任何相当数量的javascript的html文件，这个过程会很糟糕。 对我来说幸运的是，我所拥有的只是一个onload，我可以将其作为window.addlistener onload事件移动到一个单独的js文件中。

您真正需要阅读以解决此问题的页面位于： https ： //developer.chrome.com/apps/contentSecurityPolicy

Answer 2

只需使用https协议即可。 您收到的错误与内容安全策略有关。

请参阅页面的“ Relaxing the default policy部分。 它提到您只能将HTTPS ， chrome-extension和chrome-extension-resource列入白名单。

Answer 3

当我运行Augury chrome扩展来调试Angular应用程序时，我收到此错误[报告]。 禁用扩展名，错误消失。 这不会对正在编写扩展的人有所帮助，但它可能对那些没有编写扩展的人有所帮助。

[Report Only] Refused to load the script 'https://apis.google.com/js/googleapis.proxy.js?onload=startup' because it violates the following Content Security Policy directive: "script-src 'report-sample' 'nonce-EagvF0PX1Z3gVL2Dka1hbA' 'unsafe-inline' 'strict-dynamic' https: http:". 'strict-dynamic' is present, so host-based whitelisting is disabled. Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

内容安全政策：无法在Chrome扩展程序中加载Google API

问题描述

3 个解决方案

解决方案1
28 2012-09-27 15:14:30

解决方案2
22 已采纳 2012-08-26 10:00:34

解决方案3
0 2019-07-12 05:10:22

内容安全政策：无法在Chrome扩展程序中加载Google API

问题描述

3 个解决方案

解决方案1 28 2012-09-27 15:14:30

解决方案2 22 已采纳 2012-08-26 10:00:34

解决方案3 0 2019-07-12 05:10:22

解决方案1
28 2012-09-27 15:14:30

解决方案2
22 已采纳 2012-08-26 10:00:34

解决方案3
0 2019-07-12 05:10:22