“未经检查的 runtime.lastError：消息端口在收到响应之前关闭。” Chrome 扩展程序答案

【问题标题】："Unchecked runtime.lastError: The message port closed before a response was received." Chrome extension“未经检查的 runtime.lastError：消息端口在收到响应之前关闭。” Chrome 扩展程序
【发布时间】：2021-02-15 16:01:38
【问题描述】：

我正在构建一个 chrome 扩展，并试图在我的背景和内容脚本之间建立连接，但 `chrome.runtime.lastError 设置为：

The message port closed before a response was received.

我遵循了这个解决方案How to implement "return true;"? Error: "The message port closed before a response was received."，并添加了“return true”以将其标记为异步以保持端口打开，但仍然出现错误。这是我的代码

bacground.js

chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
  var message = { message: "tab has been updated, read HTML from tab" };
  chrome.tabs.sendMessage(tabId, message);

  //send second message
  chrome.tabs.sendMessage(
    tabId,
    { tabCreated: "true" },
    function (response) {
      if (chrome.runtime.lastError){
        console.log(chrome.runtime.lastError)
      }
      console.log("received response from context page", response)
      contextPageWidth = response.pageWidth
    });

});

content.js

  chrome.runtime.onMessage.addListener((request, sendResponse) => {
    sendResponse({pageWidth:"100"})
    return true;
  });

有人知道我哪里出错了吗？

【问题讨论】：

这基本上是一个错字：您在request 之后错过了sender 参数，请参阅文档。顺便说一句，您在这里不需要return true。同时删除第一个 chrome.tabs.sendMessage(tabId, message);

标签： javascript google-chrome google-chrome-extension

【解决方案1】：

您需要像这样将“sender”参数添加到您的事件侦听器中：

chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
        sendResponse({message:foo})
        return true;
      });

【讨论】：