tabs.executeScript()

將 JavaScript 程式碼注入頁面。

注意: 在使用 Manifest V3 或更高版本時,請使用 scripting.executeScript() 來執行指令碼。

您可以將程式碼注入到其 URL 可以使用 匹配模式 表達的頁面中。要做到這一點,其協議必須是以下之一:httphttpsfile

您必須擁有該頁面 URL 的許可權 — 要麼是明確的 主機許可權 — 要麼透過 activeTab 許可權。請注意,一些特殊頁面不允許此許可權,包括閱讀模式、檢視原始碼和 PDF 檢視器頁面。

您還可以將程式碼注入到隨您的擴充套件打包的頁面中

js
browser.tabs.create({ url: "/my-page.html" }).then(() => {
  browser.tabs.executeScript({
    code: `console.log('location:', window.location.href);`,
  });
});

您不需要任何特殊許可權即可執行此操作。

不能將程式碼注入到任何瀏覽器的內建頁面,例如:about:debuggingabout:addons 或開啟新空標籤頁時開啟的頁面。

您注入的指令碼稱為 內容指令碼

這是一個非同步函式,返回一個 Promise

語法

js
let executing = browser.tabs.executeScript(
  tabId,                 // optional integer
  details                // object
)

引數

tabId 可選

integer。在其中執行指令碼的標籤 ID。

預設為當前視窗的活動標籤頁。

details

一個描述要執行的指令碼的物件。

它包含以下屬性

allFrames 可選

boolean。如果為 true,則程式碼將被注入到當前頁面的所有框架中。

如果為 true 並且設定了 frameId,則會引發錯誤。(frameIdallFrames 是互斥的。)

如果為 false,則程式碼僅注入到頂層框架。

預設為 false

code 可選

string。要注入的程式碼,作為文字字串。

警告: 不要使用此屬性將不受信任的資料插入 JavaScript,這可能會導致安全問題。

file 可選

string。包含要注入的程式碼的檔案路徑。

  • 在 Firefox 中,非從擴充套件根目錄開始的相對 URL 將相對於當前頁面 URL 進行解析。
  • 在 Chrome 中,這些 URL 將相對於擴充套件的基礎 URL 進行解析。

要實現跨瀏覽器相容,您可以將路徑指定為相對 URL,從擴充套件的根目錄開始,如下所示:"/path/to/script.js"

frameId 可選

integer。程式碼應注入的框架。

預設為 0(頂層框架)。

matchAboutBlank 可選

boolean。如果為 true,則程式碼將被注入到嵌入的 about:blankabout:srcdoc 框架中,前提是您的擴充套件可以訪問它們的父文件。程式碼不能插入到頂層的 about: 框架中。

預設為 false

runAt 可選

extensionTypes.RunAt。程式碼將最早被注入到標籤頁中的時間。

預設為 "document_idle"

返回值

一個 Promise,它將解析為物件陣列。陣列的值表示指令碼在每個注入的框架中的結果。

指令碼的結果是最後評估的語句,這類似於在 Web Console 中執行指令碼時會輸出的內容(結果,而不是任何 console.log() 輸出)。例如,考慮以下指令碼

js
let foo = "my result";
foo;

這裡的結果陣列將包含字串 "my result" 作為元素。

結果值必須是 結構克隆able(請參閱 資料克隆演算法)。

注意: 最後一條語句也可能是一個 Promise,但此功能不受 webextension-polyfill 庫支援。

如果發生任何錯誤,Promise 將以錯誤訊息被拒絕。

示例

此示例在當前活動標籤頁中執行一行程式碼片段

js
function onExecuted(result) {
  console.log(`We made it green`);
}

function onError(error) {
  console.log(`Error: ${error}`);
}

const makeItGreen = 'document.body.style.border = "5px solid green"';

const executing = browser.tabs.executeScript({
  code: makeItGreen,
});
executing.then(onExecuted, onError);

此示例執行一個檔案(隨擴充套件打包)名為 "content-script.js" 的指令碼。該指令碼將在當前活動標籤頁中執行。指令碼將在子框架和主文件中執行

js
function onExecuted(result) {
  console.log(`We executed in all subframes`);
}

function onError(error) {
  console.log(`Error: ${error}`);
}

const executing = browser.tabs.executeScript({
  file: "/content-script.js",
  allFrames: true,
});
executing.then(onExecuted, onError);

此示例執行一個檔案(隨擴充套件打包)名為 "content-script.js" 的指令碼。該指令碼將在 ID 為 2 的標籤頁中執行

js
function onExecuted(result) {
  console.log(`We executed in tab 2`);
}

function onError(error) {
  console.log(`Error: ${error}`);
}

const executing = browser.tabs.executeScript(2, {
  file: "/content-script.js",
});
executing.then(onExecuted, onError);

擴充套件程式示例

瀏覽器相容性

注意: 此 API 基於 Chromium 的 chrome.tabs API。此文件源自 Chromium 程式碼中的 tabs.json