如何获取Chrome扩展弹窗前最后聚焦的非扩展窗口活动标签页？

问题原因 #

当你点击扩展图标触发chrome.windows.create()打开弹窗C时，弹窗会立即成为lastFocusedWindow，此时用tabs.query({active: true, lastFocusedWindow: true})查询到的自然是弹窗C的标签，而非之前聚焦的窗口B的活动标签。

解决方案 #

移除扩展manifest中action的default_popup配置，改用chrome.action.onClicked事件监听图标点击——该事件会在弹窗创建前触发，回调参数直接返回点击图标瞬间的活动标签（即窗口B的目标标签）。之后可通过URL参数或存储传递该标签ID给弹窗。

1. Service Worker 代码示例

// service-worker.js
chrome.action.onClicked.addListener(async (clickedTab) => {
  // clickedTab就是点击图标时窗口B的活动标签
  const targetTabId = clickedTab.id;

  // 方式1：通过URL参数传递标签ID给弹窗C
  await chrome.windows.create({
    url: `popup.html?tabId=${targetTabId}`,
    type: 'popup',
    width: 300,
    height: 400
  });

  // 方式2：存储到chrome.storage.local（适合弹窗延迟使用的场景）
  // await chrome.storage.local.set({ lastFocusedTabId: targetTabId });
});

2. 弹窗页面获取标签ID

// popup.js
document.addEventListener('DOMContentLoaded', () => {
  // 从URL参数读取标签ID
  const urlParams = new URLSearchParams(window.location.search);
  const tabId = urlParams.get('tabId');
  console.log('弹窗前的活动标签ID：', tabId);

  // 若用存储方式读取
  // chrome.storage.local.get('lastFocusedTabId', (data) => {
  //   console.log('弹窗前的活动标签ID：', data.lastFocusedTabId);
  // });
});

注意事项 #

如果你的扩展原本配置了default_popup，必须删除该配置，否则chrome.action.onClicked事件不会触发。

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