将Google API Javascript客户端库加载到Chrome扩展中_Javascript_Google Chrome Extension_Google Api Java Client

将Google API Javascript客户端库加载到Chrome扩展中

javascript google-chrome-extension

将Google API Javascript客户端库加载到Chrome扩展中,javascript,google-chrome-extension,google-api-java-client,Javascript,Google Chrome Extension,Google Api Java Client,我已经尝试将google api javascript客户端库与chrome扩展结合了一段时间，但是chrome扩展似乎有一个可怕的冷脚案例。指向脚本的链接是下载文件很麻烦，因为脚本实际上加载了其他脚本。我试着把它包括在舱单里 manifest.json（节选）但是扩展没有加载。我还尝试将脚本注入到背景html中 background.js（节选）但是chrome调试器给了我拒绝加载脚本'https://apis.google.com/js/client.js'因为它违反了以下内容安全

我已经尝试将google api javascript客户端库与chrome扩展结合了一段时间，但是chrome扩展似乎有一个可怕的冷脚案例。指向脚本的链接是

下载文件很麻烦，因为脚本实际上加载了其他脚本。我试着把它包括在舱单里

manifest.json（节选）

但是扩展没有加载。我还尝试将脚本注入到背景html中

background.js（节选）

但是chrome调试器给了我

拒绝加载脚本'https://apis.google.com/js/client.js'因为它违反了以下内容安全策略指令：“script src'self'chrome extension resource:”。

有什么想法吗，还是注定要分开

编辑：请注意，如果要使用回调函数，必须将“？onload=myCallbackFunction”添加到脚本url。谢谢你，伊利亚。更多信息

您只需设置此库的onload方法

和handleClientLoad-默认的注册方法

到目前为止，我找到的唯一解决方案是首先将脚本注入后台html页面，就像我所做的那样：

background.js（节选）

然后要绕过安全警告，请编辑清单文件（）：

manifest.json（节选）

但是，请注意，绕过安全性仅适用于

https

链接，而且我还发现它有点黑客行为…欢迎使用任何其他解决方案我尝试按照woojoo666的建议添加清单文件，但仍然失败，看起来我们需要再添加一个标志“不安全评估”：

“内容安全策略”：“脚本src'self”“不安全评估”“对象src'self”“，

我在

https://apis.google.com/js/client.js

。内容如下：

gapi.load（“客户机”{callback:window[“gapi_onload”]。。。。。。

gapi.load

在网页中加载

client.js

后立即被调用。它看起来像是

窗口。加载gapi.client
后，gapi\u onload

将作为回调被调用

作为概念证明，我建造了这个plunker：

gapi.auth

和

gapi.client

都已成功打印到控制台

回到Chrome扩展

我把它放在我的

mainfest.json

的后台部分：

“背景”：{
“脚本”：[
“background.js”，
“gapi client.js”
]
}

其中，

background.js

是我扩展中的主后台脚本，

gapi client.js

的所有内容都是直接从

https://apis.google.com/js/client.js

在

background.js内部，它的内容如下：
window.gapi_onload=function（）{
log（'gapi-loaded'，gapi.auth，gapi.client）；
//使用gapi.auth和gapi.client执行您想要的操作。
}

请注意，background.js
是在gapi client.js
之前加载的。因为gapi client.js
一加载就读取window[“gapi\u onload”]
，所以必须在加载之前指定window.gapi\u onload

结果，window.gapi\u onload
按预期被调用，同时gapi.auth
和gapi.client
被填充
在我的解决方案中，我没有自己创建background.html
。我也没有修改内容安全策略。但是，请注意，该解决方案没有文档记录，因此将来可能会发生更改。
您可以通过background.html加载background.js来加载它们
<html>
 <head>
  <title></title>
  <script src="background.js"></script>
 </head>
 <body>
 </body>
 <script src="https://apis.google.com/js/client.js"></script>
</html>

呃，问题是加载库，而不是回调函数，为了简单起见，我省略了回调函数。实际上，这解决了我遇到的一个次要问题，但不是主要问题……无论如何，谢谢！我编辑了我的帖子以防止混淆伟大的解决方案！我发现了同样的问题，但即使使用windo.gapi_onload在modula中也不是很好用r应用程序（我正在编写backbone.js应用程序）。你没有发现这个API有任何有用的包装吗？当我在清单中包含gapi-client.js时，它试图在background.html源中包含来自API.google.com的第三个外部脚本。你看到了吗？因为这对我来说实际上是同一个错误。下面是脚本的完整url：刚刚尝试过，对m不起作用e、 它打印undefined-undefined。我想可能是这个答案发布后客户端脚本发生了更改。第一个答案（修改CSP）确实有效。这非常有效。初始化gapi后，我只需获取chrome令牌并将其发送以获取用户信息。保存了我的一天。谢谢！如果你只是复制粘贴，是的，它将返回未定义的未定义，因为你必须有一个令牌来使用它。
 var body = document.getElementsByTagName('body')[0];
 var script = document.createElement('script');
 script.type = 'text/javascript';
 script.src = "https://apis.google.com/js/client.js?onload=callbackFunction";

 body.appendChild(script);

 var head = document.getElementsByTagName('head')[0];
 var script = document.createElement('script');
 script.type = 'text/javascript';
 script.src = "https://apis.google.com/js/client.js?onload=callbackFunction";
 head.appendChild(script);

"content_security_policy": "script-src 'self' https://apis.google.com; object-src 'self'"

<html>
 <head>
  <title></title>
  <script src="background.js"></script>
 </head>
 <body>
 </body>
 <script src="https://apis.google.com/js/client.js"></script>
</html>

"background":
{
 "page": "background.html"     
}, 
"content_security_policy": "script-src 'self' https://apis.google.com; object-src 'self'",