javascript - GAPI 未定义

Question

我很难将 Google javascript api 加载到我的 chrome 扩展程序中。请注意我是 javascript 的新手，甚至是 chrome 扩展的新手。

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

chrome.tabs.executeScript(null, { file: "ChromeExtension.js" });

ChromeExtension.js 文件如下所示

//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);


}

我的问题是在

gapi.client.setApiKey(apiKey);

我得到 gapi is not defined 一旦我的 ChromeExtension.js 完成执行，gapi 就完全定义并可用了。

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

感谢您的宝贵时间。

编辑 - 当前 GAPI 负载

function () loadGAPIClient(){
    var s = document.createElement("script");
        s.type = "text/javascript";
        s.src = "https://apis.google.com/js/client.js";
        $("head").append(s);
}

此函数在我的 init() 中调用，我也对其进行了更新以反射(reflect)这一点。

我还尝试过使用 jQuery.getScript 等方式。

请理解这是我的问题，我找不到正确加载 GAPI 客户端的方法

Answer 1

Isolated world问题。

具体来说，您的 loadGAPIClient添加 <script>然后在页面上下文中执行脚本的标记，这与内容脚本上下文不同。

最终结果是gapi已在页面代码中定义(如果页面加载了自己的副本，可能会产生冲突)，但在您的代码中仍未定义。

我看不到一条简单的出路。您只能通过调用 executeScript 在内容脚本上下文中加载内容或在 list 中声明它们；如果我没记错的话，GAPI 将尝试使用 <script> 加载更多库注入(inject)方法。

所以我猜你最好的选择是在后台页面加载库并从那里使用它，因为只要你以这种方式加载外部 JS 就可以了 modify the CSP .

或者，您可以尝试 this library ，它解决了默认 CSP 的问题并使用 chrome.identity应用程序接口(interface)。它可能符合您的需求，但同样不适用于内容脚本。