如何从background向offscreen中iframe内的content script发送消息？

你的层级链是background > offscreen > iframe > inner content script，且已设置all_frames: true，可以通过两层消息中转实现通信，具体步骤如下：

核心思路 #

Background无法直接和iframe内的content script通信，需要借助Offscreen页面作为中转：

1. Background先将消息发送给Offscreen页面
2. Offscreen页面再将消息转发到目标iframe内的content script

具体实现代码 #

1. Background页面发送消息到Offscreen #

// Background脚本：发送消息给Offscreen，携带要传递给inner content的内容
chrome.runtime.sendMessage({
  type: "FOR_INNER_CONTENT",
  payload: { data: "需要传递给inner content的内容" }
});

2. Offscreen页面接收并转发消息 #

Offscreen需要先获取目标Tab的ID，再通过chrome.tabs.sendMessage指定frameId发送到对应iframe的content script。如果不确定frameId，可以让inner content script主动注册自身信息。

方式一：已知目标frameId的情况

// Offscreen脚本：监听Background的消息并转发
chrome.runtime.onMessage.addListener((msg, sender, sendResponse) => {
  if (msg.type === "FOR_INNER_CONTENT") {
    // 获取当前活跃Tab的ID（可根据实际场景替换为目标Tab的ID）
    chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
      const targetTabId = tabs[0].id;
      // 发送消息到指定Tab的目标iframe内的content script
      chrome.tabs.sendMessage(targetTabId, msg.payload, {
        frameId: 1 // 替换为实际的iframe的frameId
      }, (response) => {
        // 处理inner content的响应（可选）
        if (chrome.runtime.lastError) {
          console.error("转发消息失败：", chrome.runtime.lastError);
        }
      });
    });
  }
});

方式二：动态获取frameId（推荐）

让inner content script加载后主动向Offscreen注册自身的Tab和frame信息，Offscreen记录后复用：

// Offscreen脚本：新增注册监听逻辑
let registeredFrames = new Map();

chrome.runtime.onMessage.addListener((msg, sender, sendResponse) => {
  // 处理inner content的注册请求
  if (msg.type === "REGISTER_FRAME") {
    const key = `${sender.tab.id}-${sender.frameId}`;
    registeredFrames.set(key, { tabId: sender.tab.id, frameId: sender.frameId });
    sendResponse({ status: "注册成功" });
    return;
  }

  // 处理Background的转发请求
  if (msg.type === "FOR_INNER_CONTENT") {
    // 这里以当前活跃Tab为例，可根据需求选择已注册的frame
    chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
      const targetTabId = tabs[0].id;
      // 找到该Tab下已注册的inner content frame（可根据需求筛选）
      const targetFrame = Array.from(registeredFrames.values()).find(item => item.tabId === targetTabId);
      if (targetFrame) {
        chrome.tabs.sendMessage(targetFrame.tabId, msg.payload, { frameId: targetFrame.frameId }, (response) => {
          if (chrome.runtime.lastError) {
            console.error("转发消息失败：", chrome.runtime.lastError);
          }
        });
      }
    });
  }
});

3. Inner Content Script接收消息（并注册自身） #

// Inner Content Script：主动向Offscreen注册自身
chrome.runtime.sendMessage({ type: "REGISTER_FRAME" })
  .catch(err => console.error("注册失败：", err));

// 监听来自Offscreen的消息
chrome.runtime.onMessage.addListener((msg, sender, sendResponse) => {
  console.log("Inner Content Script收到消息：", msg);
  // 可选：发送响应给Offscreen
  sendResponse({ status: "消息已接收" });
});

注意事项 #

• 确保manifest中已正确配置Offscreen页面权限，示例配置片段：

  "offscreen": {
    "matches": ["<all_urls>"],
    "document": "offscreen.html"
  }
  

• all_frames: true已确保content script注入到所有iframe中，无需额外配置
• 处理chrome.runtime.lastError，避免因iframe未加载、content script未注入等场景导致的报错

内容的提问来源于stack exchange，提问作者Viewed