Chrome扩展：chrome.tabs.executeScript获取函数返回值问题

我来帮你搞定这个问题！Chrome的chrome.tabs.executeScript获取返回值的逻辑其实有明确的规则，你遇到的情况大概率是没踩对这两个关键点：要么函数的返回值没被作为脚本的最终输出，要么函数里有异步操作没正确处理。下面分两种场景给你具体解决方案：

场景1：同步函数，但没正确返回结果 #

假设你修改后的test.js是只定义了函数但没正确触发返回，比如：

function getMyValue() {
  const result = "预期值";
  console.log(result);
  return result;
}
// 这里只定义了函数，没调用，或者调用了但没让结果成为脚本的最终表达式

这种情况下，executeScript拿到的是函数本身，而不是函数的返回值。你需要确保函数调用的结果是脚本最后执行的内容：

修改后的test.js：

function getMyValue() {
  const result = "预期值";
  console.log(result);
  return result;
}
// 调用函数，让它的返回值成为脚本的最终输出
getMyValue();

或者更简洁的自执行函数写法：

(function() {
  const result = "预期值";
  console.log(result);
  return result;
})();

然后在popup.js里，记得用Promise（Chrome 88+支持）或者回调来接收结果：

// 推荐用Promise版本的API，更简洁
chrome.tabs.query({active: true, currentWindow: true}, (tabs) => {
  chrome.tabs.executeScript(tabs[0].id, {file: 'test.js'})
    .then((results) => {
      // results是数组，第一个元素就是脚本返回的值
      console.log("拿到结果啦：", results[0]);
    })
    .catch((err) => {
      console.error("执行脚本出错：", err);
    });
});

场景2：函数包含异步操作（比如API请求、定时器） #

如果你的函数里有异步逻辑，比如用fetch或者setTimeout，就算脚本里的console.log能输出，executeScript也会直接返回undefined——因为脚本执行完的时候，异步操作还没完成。这时候得用Promise来处理：

修改test.js为：

async function getAsyncValue() {
  // 举个异步请求的例子
  const res = await fetch('https://example.com/api/data');
  const data = await res.text();
  console.log(data);
  return data;
}
// 返回这个异步操作的Promise，executeScript会自动等它完成
getAsyncValue();

或者用普通Promise写法：

new Promise((resolve) => {
  setTimeout(() => {
    const result = "异步延迟后的结果";
    console.log(result);
    resolve(result);
  }, 1000);
});

这时候popup.js里的代码不需要改，executeScript的Promise会自动等待异步操作完成，拿到最终的返回值。

几个关键注意事项 #

• 一定要确保注入的脚本最后执行的是你想要返回的值的表达式——如果是函数，必须调用它，让返回值成为脚本的最终输出。
• 异步逻辑必须用Promise包裹，chrome.tabs.executeScript会识别并等待Promise resolve后的结果。
• 检查你的扩展权限：manifest.json里要声明tabs或者activeTab权限，如果要访问外部API，还要加对应的host_permissions，比如：

{
  "permissions": ["activeTab"],
  "host_permissions": ["https://example.com/*"]
}

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