GAPI没有定义 [英] GAPI Is Not Defined

问题描述

在我的Chrome扩展中加载Google javascript api时遇到了很多问题。请注意，我对JavaScript很新，甚至对Chrome扩展更新。

我有一个执行脚本的background.js文件

  chrome.tabs.executeScript（null，{file：ChromeExtension.js}）; 
  

然后，ChromeExtension.js文件如下所示：

  //调用初始化方法
 init（）; 
 
 //函数初始化Chrome扩展
函数init（）{
 var clientID ='客户端ID'; 
 var apiKey ='API Key'; 
 var scopes ='https://www.googleapis.com/auth/plus.me'; 
 
 loadGAPIClient（）; 
 
 gapi.client.setApiKey（apiKey）; 
 
 
} 
  

我的问题是在

  gapi.client.setApiKey（apiKey）; 
  

我得到 gapi未定义这件事曾经是我的ChromeExtension.js已完成执行，gapi已完全定义并可用。

我曾尝试过其他一些堆栈溢出问题的建议，但无济于事。我相信这是由于缺乏Javascript知识，但如果有人能够提供一些帮助，我将不胜感激。

感谢您的时间。

$ b $ p 编辑 - 当前GAPI加载

  function（） loadGAPIClient（）{
 var s = document.createElement（script）; 
 s.type =text / javascript; 
 s.src =https://apis.google.com/js/client.js; 
 $（head）。append（s）; 
 
 
 
 $ b 
这个函数在我的init（）中被调用，我也更新了反映了这一点。
 
 
 
我也尝试过使用jQuery.getScript和其他方法。 
 
 
 
请理解这是我的问题，我无法找到正确加载GAPI客户端的方法 
 
解决方案
 孤立的世界问题。
 
 
 
具体而言，您的 loadGAPIClient 会添加一个< script> 标签，然后执行该标签该脚本在页面的上下文中，与内容脚本上下文不同。
 
 
 
最终结果是 gapi 在页面的代码中定义（如果页面加载了自己的副本，可能会产生冲突），但在您的代码中仍未定义。
 
 
 
我没有看到简单的出路。您只能通过调用 executeScript 或在清单中声明它们来加载内容脚本上下文中的内容;如果我记得正确，GAPI将尝试使用< script> 注入方法加载更多库。
 
 
 
我想你最好的选择是将库加载到后台页面，并从那里使用它，因为只要你修改CSP 。或者，您可以尝试这个库，它可以解决你遇到的问题默认CSP并使用 chrome.identity  API。它可能适合您的需求，但它也不适用于内容脚本。
 
I am having much trouble getting the Google javascript api to load in my chrome extension. Please note I am very new to javascript and even newer to chrome extensions. 

I have a background.js file which executes a script
chrome.tabs.executeScript(null, { file: "ChromeExtension.js" });
This ChromeExtension.js file then look as follows
//Call Initialize Method
init();

//Function To Initial Chrome Extension
function init(){
    var clientID = 'Client ID';
    var apiKey = 'API Key';
    var scopes = 'https://www.googleapis.com/auth/plus.me';

    loadGAPIClient();

    gapi.client.setApiKey(apiKey);


}
My problem is that at
gapi.client.setApiKey(apiKey);
I get gapi is not defined The thing is once my ChromeExtension.js has completed execution, gapi is fully defined and available. 

I have tried other suggestions in some stack overflow questions but to no avail. I believe this is due to lack of Javascript knowledge but I would be grateful if anyone would be able to provide some assistance.

Thank you for your time.

EDIT - Current GAPI Load
function () loadGAPIClient(){
    var s = document.createElement("script");
        s.type = "text/javascript";
        s.src = "https://apis.google.com/js/client.js";
        $("head").append(s);
}
This function is called in my init(), which I have also updated to reflect this.

I have also tried using jQuery.getScript among other ways. 

Please understand this is my issue, I cannot find a way to correctly load the GAPI Client
解决方案
Isolated world problem.

Specifically, your loadGAPIClient adds a <script> tag which then executes the script in the page's context, which is different from the content script context.

The end result is that gapi becomes defined in the page's code (possibly creating a conflict if the page loaded own copy), but is still undefined in yours.

I don't see an easy way out. You can only load things in the content script context by calling executeScript or declaring them in the manifest; and if I recall correctly GAPI will try to load more libraries with the <script> injection method.

So I guess your best bet is to load the library in a background page and work with it from there, since loading external JS this way will be okay as long as you modify the CSP.

Or alternatively, you could try this library, which works around the issues you have with default CSP and uses chrome.identity API. It may fit your needs, though again it won't work in a content script.

                        
这篇关于GAPI没有定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！