如何解決 Chrome 擴充功能中從背景到注入後台的腳本間通訊問題？

Chrome 擴充程式中跨多個腳本的訊息傳遞：從後台到注入

後台

中在Chrome 擴充功能的上下文中，在不同環境中執行的腳本之間發送訊息可能具有挑戰性。以下是您在嘗試將訊息從後台腳本發送到內容腳本並隨後發送到注入腳本時遇到的特定問題的詳細分析和解決方案。

問題：

由於內容腳本注入目標的方式，您的程式碼無法傳送訊息。最初，內容腳本不會出現在現有選項卡中，除非頁面專門觸發它們的注入。這表示當您的後台腳本嘗試在擴充功能載入時向選項卡發送訊息時，沒有偵聽器可以接收該訊息。

解決方案：

解決方案1：隨選訊息

// Background
function ensureSendMessage(tabId, message, callback){
  chrome.tabs.sendMessage(tabId, {ping: true}, function(response){
    if(response && response.pong) { // Content script ready
      chrome.tabs.sendMessage(tabId, message, callback);
    } else { // No listener on the other end
      // Inject the script and then send the message
    }
  });
}

發送訊息前檢查內容腳本是否準備好：

// Content
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  if(request.ping) { sendResponse({pong: true}); return; }
  // Process messages
});

解決方案2：注入並執行一次

// Background
function injectAndSend(tabId, message, callback){
  // Inject script and send message
}

注入內容腳本，但確保它只執行一次：

// Content
var executed; // Flag to prevent multiple executions

if(!executed){
  executed = true;
  // Process messages
}

解決方案3：不加區分地註入

// Background
chrome.tabs.query({}, function(tabs) {
  for(var i in tabs) {
    // Inject scripts and send messages
  }
});

注入內容腳本而不使用依賴它們的存在：

解決方案4：使用瀏覽器操作

chrome.browserAction.onClicked.addListener(function() {
  // Process messages
});

將訊息傳遞邏輯附加到特定使用者互動的瀏覽器操作：

孤立內容腳本

需要考慮的一個意義是孤立內容腳本的現象。當擴充功能重新載入時，內容腳本可能無法正確清理，留下可能幹擾新註入腳本的事件監聽器。

解決方案：

實現心跳機制檢查內容腳本和後台腳本之間的連接。如果心跳失敗，內容腳本應取消註冊偵聽器並延遲任何操作。

結論：

透過了解Chrome 擴充功能中內容腳本的行為並採用適當的方法訊息傳遞技術，您可以有效地將訊息從後台腳本傳送到內容腳本和注入腳本。

以上是如何解決 Chrome 擴充功能中從背景到注入後台的腳本間通訊問題？的詳細內容。更多資訊請關注PHP中文網其他相關文章！