内容安全策略:无法在Chrome扩展中加载Google API

这是一个相对的Chrome扩展。我正在尝试一个简单的使用谷歌图表API

我在我的html文档"popup.html"中有这段代码，它是在点击图标时加载的。

<!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'self'chrome扩展资源："。

我知道这是与权限有关的，我试图修改我的清单文件，但没有成功：

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

知道吗？

在过去的12个小时里，我一直在努力解决这个问题，终于解决了。为什么花了这么长时间？因为我被甩了好几次了。首先，虚假线索：

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

解决方案：

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

您真正需要阅读的页面是在这里度过这个问题：https://developer.chrome.com/apps/contentSecurityPolicy

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

请参阅本页的Relaxing the default policy部分。其中提到您只能将HTTPS、chrome-extension和chrome-extension-resource列入白名单。

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

[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.

相关内容

最新更新

热门标签：