你的原始方案是可行的，但确实有更轻量化的实现方式——我们可以省去专门的Background脚本中转，直接在网页A和网页B的Content Script之间完成通信触发操作，具体分两种场景处理：

场景1：网页A和网页B同域 #

如果两个页面属于同一个域名，完全不需要依赖Chrome扩展的消息API，直接用浏览器原生能力就能实现：

网页A的Content Script #

// 监听网页A的触发按钮点击
document.getElementById('trigger-btn').addEventListener('click', () => {
  // 用Broadcast Channel发送操作指令
  const controlChannel = new BroadcastChannel('page-action-channel');
  controlChannel.postMessage({ action: 'run-workflow' });
});

网页B的Content Script #

// 监听广播消息，收到指令后执行操作
const controlChannel = new BroadcastChannel('page-action-channel');
controlChannel.onmessage = (event) => {
  if (event.data.action === 'run-workflow') {
    executePageBOperations();
  }
};

function executePageBOperations() {
  // 按顺序执行预设操作：点击菜单→填充表单→保存
  document.querySelector('.nav-menu').click();
  document.getElementById('form-username').value = '自动填充内容';
  document.getElementById('save-form-btn').click();
}

这种方式完全不需要扩展的Background脚本，代码更轻量化，逻辑也更直接。

场景2：网页A和网页B跨域 #

跨域情况下无法用原生广播，但我们可以让网页A的Content Script直接定位到网页B的Tab，然后发送消息触发操作，省去Background的中转步骤：

步骤1：配置Manifest权限 #

确保你的manifest.json中声明了tabs权限，以及两个页面的Content Script匹配规则：

{
  "manifest_version": 3,
  "permissions": ["tabs"],
  "content_scripts": [
    {
      "matches": ["https://网页A的域名/*"],
      "js": ["content-script-a.js"]
    },
    {
      "matches": ["https://网页B的域名/*"],
      "js": ["content-script-b.js"]
    }
  ]
}

网页A的Content Script（content-script-a.js） #

// 监听按钮点击，直接定位网页B的Tab并发送指令
document.getElementById('trigger-btn').addEventListener('click', async () => {
  // 查询已打开的网页B标签页
  const targetTabs = await chrome.tabs.query({ url: "https://网页B的域名/*" });
  
  if (targetTabs.length > 0) {
    // 给网页B的Content Script发送消息
    await chrome.tabs.sendMessage(targetTabs[0].id, { action: 'run-workflow' });
  } else {
    // 如果网页B未打开，自动打开后再发送指令
    const newTab = await chrome.tabs.create({ url: "https://网页B的域名/" });
    // 等待页面加载完成后执行操作
    setTimeout(async () => {
      await chrome.tabs.sendMessage(newTab.id, { action: 'run-workflow' });
    }, 2000);
  }
});

网页B的Content Script（content-script-b.js） #

// 监听来自网页A的消息，触发操作流程
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
  if (message.action === 'run-workflow') {
    executePageBOperations();
    sendResponse({ status: '操作已执行' });
  }
});

function executePageBOperations() {
  // 按需求执行操作序列
  document.querySelector('.menu-item').click();
  document.getElementById('form-content').value = '自动填充的表单内容';
  document.getElementById('submit-btn').click();
}

为什么这个方案更简洁？ #

• 去掉了冗余的Background中转逻辑，减少了代码层级和维护成本
• 消息传递路径更短，从网页A直接到网页B，性能更优
• 代码结构更清晰，每个Content Script只负责对应页面的逻辑，职责单一

注意：如果你的扩展是Manifest V2，API调用方式基本一致，仅需将async/await替换为回调函数即可。

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