Chrome擴展程序可加載頁面並注入代碼

Question

我正在嘗試創建一個簡單的擴展程序，該擴展程序將加載給定的頁面並在頁面加載后注入代碼。

我提出了以下建議，我這樣做正確嗎？

background.js

    chrome.tabs.getCurrent(function (tab) {
      chrome.tabs.update(tab.id, {url: "http://www.EXAMPLE.COM"});
    });

    chrome.tabs.onUpdated.addListener(function(tabId , info) {
        if (info.status == "complete") {
                 chrome.tabs.executeScript(null, {file: "content_script.js"});
        }
    });

Answer 1

將chrome.tabs文檔引用為chrome.tabs.getCurrent ：

獲取進行此腳本調用的選項卡。 如果是從非制表符上下文調用的，則可能是未定義的（ 例如：背景頁面或彈出視圖）。

要獲取當前處於活動狀態的標簽，您應該改用chrome.tabs.query ：

chrome.tabs.query({currentWindow: true, active: true}, function(tabs){
  // Do something with tabs[0]
});

另外，如果您對用戶輸入做出反應（例如單擊瀏覽器操作），則已經提供了當前標簽：

chrome.browserAction.onClicked.addListener(function(tab){
  // "tab" is the current active tab
});

---

您可以簡單地創建一個新標簽（而不是獲取已經打開的標簽）（當然，這取決於您要實現的目標）：

chrome.tabs.create({url: "http://www.EXAMPLE.COM"});

---

每當任何標簽（而不只是您創建的標簽）加載完成時，您的偵聽器都會嘗試將內容腳本注入當前標簽（您使用null ）。 從create / update回調中這樣做比較安全，即

chrome.tabs.update(tab.id, {url: "http://www.EXAMPLE.COM"}, function(tab){
  chrome.tabs.executeScript(tab.id, {file: "content_script.js"});
});

注意：您不必擔心頁面此時尚未完成加載。 executeScript遵循run_at參數 ，該參數默認為“ DOM加載后的某個時間”。