在內容腳本中使用 Chrome API 時，為什麼會出現「無法讀取未定義的屬性」？

在內容腳本中存取Chrome API：處理「無法讀取未定義的屬性」錯誤

嘗試使用Chrome API 函數（例如chrome）時.tabs 在內容腳本中，可能會導致錯誤「無法讀取未定義的屬性」。儘管在擴充功能的清單中明確包含必要的權限，但還是會發生這種情況。

內容腳本的限制

了解內容腳本對 Chrome API 功能的存取受到限制至關重要。他們主要可以存取與以下相關的API 方法子集：

• chrome.i18n
• chrome.dom
• chrome.storage
• 一些特定的chrome.runtime/chrome.extension

API中的函數，例如chrome.tabs 通常保留給背景腳本、彈出腳本和其他具有更廣泛存取瀏覽器功能的腳本類型。

解決方案：與後台腳本通訊

存取Chrome API 函數不適用於內容腳本，您需要與後台腳本建立通訊。這涉及：

1. 從內容腳本向後台腳本發送訊息。
2. 使用所需的 API 函數在背景腳本中處理訊息。
3. 傳送結果或回應回傳內容腳本。

這是實現此功能的範例解決方案：

內容腳本（myScript.js）：

// Send a message to the background script requesting access to chrome.tabs
chrome.runtime.sendMessage({ type: "access_tabs" }, response => {
  // Handle the response from the background script: e.g., display the result
});

後台腳本（background.js）：

// Background script intercepts the message from the content script
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
  if (message.type === "access_tabs") {
    // Access chrome.tabs API here and send the result back to the sender (content script)
    sendResponse({ value: chrome.tabs.getCurrent().id });
  }
});

透過實現這種通訊機制，您可以有效地擴展內容腳本的功能並存取Chrome API函數，否則這些函數將無法存取無法使用。

以上是在內容腳本中使用 Chrome API 時，為什麼會出現「無法讀取未定義的屬性」？的詳細內容。更多資訊請關注PHP中文網其他相關文章！