开发者问题收集

chrome 扩展消息传递：sendResponse 不是一个函数

2018-06-18
2411
javascript google-chrome-extension

在我的 Chrome 扩展程序中，我尝试在扩展程序的内部网页 chrome-extension://myExtensionId/path/to/web/page.html 和内容脚本之间交换数据。

因此，为了使这些数据在不同的内容脚本之间持久化，我尝试将其保存为扩展程序后台的 全局变量 ！我使用消息传递来实现这一点。

我的问题是：

当我尝试从后台发送响应时，我收到此错误：

Error in event handler for (unknown): TypeError: sendResponse is not a function

我遵循了 文档的示例 ，这是我的尝试：

在 scriptOfTheInternalPage.js 中： 

var message = {
    'order': 'setData',
    'varName': 'myArray',
    'data': myArray
};
extPort.postMessage(message, function (response) {
    console.log('response:\n', JSON.stringify(response));
});

在 background.js 中： 

var globals = {
    'myArray': [],
    ...
};
chrome.runtime.onConnect.addListener(function (port) {
    port.onMessage.addListener(
            function (message, sender, sendResponse) {
                console.log(
                        'the port received this message:\n', JSON.stringify(message), '\n',
                        (sender.tab) ? ' from tab #' + sender.tab.id : ' from the extension!'
                        );
                if (message.order === 'setData') {
                    globals[message.varName] = message.data;
                    sendResponse({'response': 'data saved!'}); //<=====
                }
                return true; //<=== tried to return true here as well;
            });
});

此错误是否意味着我应该在 onMessage 事件侦听器之外创建一个全新的函数？

我很困惑！我遗漏了什么？

1个回答

端口的 onMessage 事件侦听器与 runtime.onMessage 的签名不同。您不会获得 sender 和 sendResponse 参数，只有消息。返回 true 也无效。

要回复消息，您需要使用端口本身。 示例 涵盖了这一点： 

port.onMessage.addListener(function(msg) {
  if (msg.joke == "Knock knock")
    port.postMessage({question: "Who's there?"});
}

因此，您确实需要在两端都使用 onMessage 侦听器，并且如果可以发出多个请求，则需要某种方式来跟踪请求（唯一 ID？）。

Xan
2018-06-18