GAPI未定義

Question

我在使用我的Chrome擴展程序加載Google javascript api時遇到了很多麻煩。 請注意我是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 沒有定義事情是，一旦我的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（）中調用，我也更新了它以反映這一點。

我還嘗試過使用jQuery.getScript等方法。

請理解這是我的問題，我找不到正確加載GAPI客戶端的方法

Answer 1

孤立的世界問題。

具體來說， loadGAPIClient會添加一個<script>標記，然后在頁面的上下文中執行該腳本，這與內容腳本上下文不同。

最終結果是gapi在頁面代碼中定義（如果頁面加載了自己的副本，可能會產生沖突），但在您的代碼中仍未定義。

我沒有看到一個簡單的出路。 您只能通過調用executeScript或在清單中聲明它們來加載內容腳本上下文中的內容; 如果我沒記錯的話，GAPI將嘗試使用<script>注入方法加載更多庫。

所以我猜你最好的選擇是在后台頁面中加載庫並從那里開始使用它，因為只要你修改CSP，以這種方式加載外部JS 就沒問題了 。

或者，您可以嘗試使用此庫 ， 該庫可解決您使用默認CSP時chrome.identity的問題並使用chrome.identity API。 它可能符合您的需求，但同樣在內容腳本中也不起作用。

Answer 2

不威脅我的回答是冒犯性的，在您的代碼片段中沒有證據表明，您已經加載了Google API JavaScript庫，如同參考中顯示的那樣？

<script src="https://apis.google.com/js/plus.js?onload=init"></script>

你需要使用這個方法，不要手工調用init：讓我們為你調用gapi :)