Chrome扩展MV3中chrome.tabs.sendMessage偶发TypeError问题求助

问题背景 #

基于Chrome扩展Manifest V3（MV3）开发的项目，在background.js中实现了getCurrentTab辅助函数用于获取当前活跃标签页，当向contentScript.js发送消息时，偶发出现activeTab.id无法读取的报错，多数情况下刷新页面可临时解决，但未发现明确触发规律。

原实现代码 #

getCurrentTab函数 #

async function getCurrentTab() {
  let queryOptions = { active: true, currentWindow: true };
  let [tab] = await chrome.tabs.query(queryOptions);
  if (chrome.runtime.lastError) {
    console.log(`[getCurrentTab] Error 💥: ${chrome.runtime.lastError.message}.`);
    window.setTimeout(() => getCurrentTab(), 100);
  } else {          
    console.log(`[getCurrentTab] ✅`);
  }
  return tab;
}

消息发送逻辑 #

getCurrentTab().then((activeTab) => {
    if (!isAuthenticated) {
      chrome.tabs.sendMessage(activeTab.id, { name: "unauthenticated" }, function(response) {
        if (chrome.runtime.lastError) {
          console.log(`[background.js] Error from response for "unauthenticated" received 💥: ${chrome.runtime.lastError.message}`);
        } else {          
          console.log(`[background.js] Response for "unauthenticated" received ✅: ${response}`);
        }
      });
      return;
    }

报错信息 #

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'id')

排查思路 #

• 标签页状态异步冲突：调用chrome.tabs.query时，当前活跃标签页可能处于切换、加载或销毁的中间状态，导致查询结果为空数组，解构后tab为undefined。
• 重试逻辑无效：原代码中使用setTimeout递归调用getCurrentTab，但递归调用的结果并未返回给初始的Promise链，初始调用仍会直接返回undefined，无法通过重试补全有效结果。
• 权限配置问题：检查manifest.json是否正确声明tabs权限，若使用activeTab权限需确认触发时机符合Chrome要求（需用户交互触发，如点击扩展图标）。
• Service Worker上下文限制：MV3中后台脚本为Service Worker，可能因休眠、上下文重建导致环境状态异常，需确保调用getCurrentTab时Service Worker处于活跃状态。

更新后的代码（基于建议修改） #

async function getCurrentTab() {
  let queryOptions = { active: true, currentWindow: true };
  let [tab] = await chrome.tabs.query(queryOptions);
  if (chrome.runtime.lastError) {
    console.log(`[getCurrentTab] Error 💥: ${chrome.runtime.lastError.message}.`);
    await asyncTimeout(100);
  } else {          
    console.log(`[getCurrentTab] ✅`);
  }
  return tab;
}

const asyncTimeout = (ms) => {
  return new Promise((resolve) => {
    window.setTimeout(() => {
      getCurrentTab(),
      ms
    });
  });
};

注：当前更新代码存在逻辑问题：asyncTimeout中setTimeout的回调未正确触发resolve，且重试调用的getCurrentTab结果未返回，需进一步调整重试逻辑以确保有效结果能传递到Promise链中。

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