Chrome扩展中sendResponse调用后回调函数无法触发问题求助

你的问题核心是**chrome.runtime.sendMessage的回调函数传参方式错误**，同时存在请求参数未定义的问题，具体修正如下：

1. 核心错误：回调函数的位置不对 #

chrome.runtime.sendMessage的正确语法是：

chrome.runtime.sendMessage(message, callback);

你错误地把回调函数放在了message对象的callback属性里，导致浏览器无法识别这个回调，自然不会触发。

2. 修正后的代码 #

content.js #

setInterval(function () {
    // 把回调作为sendMessage的第二个参数传入，同时补充counter初始值
    chrome.runtime.sendMessage(
        { message: "is-playing", counter: 0 }, 
        function (response) {
            console.log("Callback triggered");
            console.log(response.counter);
        }
    );
}, 2000);

background.js #

chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
    // 先处理counter未定义的情况，避免报错
    const currentCounter = request.counter ?? 0;
    sendResponse({ counter: currentCounter + 1 });
    console.log("Response sent");
});

3. 额外注意事项 #

• 如果后台逻辑包含异步操作（比如调用API、读写存储），必须在addListener的回调末尾返回true，否则Service Worker会在异步操作完成前终止，导致sendResponse失效：

  chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
      // 异步操作示例
      setTimeout(() => {
          sendResponse({ counter: (request.counter ?? 0) + 1 });
      }, 1000);
      // 返回true保持通信通道开放
      return true;
  });
  

• 你之前用chrome.runtime.lastError检查不到错误，是因为根本没触发回调逻辑，核心问题解决后，若仍有异常可在回调函数内检查该属性。

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