將訊息從後台腳本發送到內容腳本，然後發送到注入腳本

問題：
儘管嘗試將訊息從後台頁面發送到內容腳本，然後發送到注入腳本，但該過程未能按預期工作。內容腳本無法接收來自後台腳本的訊息。

解決方案：
此問題是由內容腳本注入的方式引起的。載入擴充功能時，它不會自動將內容腳本注入現有標籤中。僅當建立新選項卡或載入擴充功能後導覽現有選項卡時才會發生注入。

解決方案1：條件腳本注入
確保後台與內容之間的通訊腳本，可以採用條件腳本注入。後台腳本可以檢查選項卡是否準備好接收訊息，並僅在尚未註入的情況下注入內容腳本。

Code:

// Background script
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
      chrome.tabs.executeScript(tabId, { file: "content_script.js" }, function () {
        if (chrome.runtime.lastError) {
          console.error(chrome.runtime.lastError);
          throw Error("Unable to inject script into tab "   tabId);
        }
        // OK, now it's injected and ready
        chrome.tabs.sendMessage(tabId, message, callback);
      });
    }
  });
}

內容腳本：

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

解決方案 2：雙重執行預防
另一個解決方案是將內容腳本注入選項卡，但採取措施防止其多次執行。

Code:

// Background script
function ensureSendMessage(tabId, message, callback) {
  chrome.tabs.executeScript(tabId, { file: "content_script.js" }, function () {
    if (chrome.runtime.lastError) {
      console.error(chrome.runtime.lastError);
      throw Error("Unable to inject script into tab "   tabId);
    }
    // OK, now it's injected and ready
    chrome.tabs.sendMessage(tabId, message, callback);
  });
}

內容腳本：

var injected;

if (!injected) {
  injected = true;
  // Your toplevel code
}

解決方案3：不加區別的腳本注入
最後，您可以選擇在擴展初始化時將內容腳本注入到所有選項卡中。只有當您的腳本在多次執行或頁面載入後不會幹擾自身時，才建議這樣做。

代碼：

chrome.tabs.query({}, function (tabs) {
  for (var i in tabs) {
    // Filter by URL if needed
    chrome.tabs.executeScript(tabs[i].id, { file: "content_script.js" }, function () {
      // Now you can use normal messaging
    });
  }
});

一旦實現這些解決方案中的任何一個，訊息就可以成功地從後台腳本中繼到內容腳本，並最終中繼到注入的腳本。