从内容脚本打开并将数据传递到弹出窗口（新选项卡）

Question

我正在编写一个 chrome 扩展程序并有一个问题。

我的扩展中有一些 .html 页面，让它成为“popup.html”。我将内容脚本注入到某个页面中，该脚本在新选项卡中打开一个“popup.html”，其中包含“var p = window.open(chrome.extension.getURL('/popup.html'), "popup" )'，效果很好。接下来，我需要将一些数据传递给这个窗口，我不知道如何以简单的方式完成。

由于某种原因，我无法从内容脚本中调用子窗口的函数

var p = window.open(chrome.extension.getURL('/popup.html'), "popup");
p.foo(data);

在控制台中我看到 Uncaught TypeError: Cannot call method 'foo' of undefined 消息。

我无法在查询字符串中传递数据，因为数据太大了。

有没有一种优雅而简单的方法可以将数据传递到这种窗口？我考虑过消息传递，但是如何使用背景页面有效地获取新打开的窗口的标签 ID？

非常感谢。

更新： 我试图反转逻辑并使用“window.opener.foo()”从父窗口获取数据，但在新打开的选项卡中window.opener 返回null。

Answer 1

好的，我找到了两个解决问题的方法。

1) 添加一个背景页面，它会打开一个带有chrome.tabs.create() 的弹出窗口。然后从内容脚本向后台页面发送消息，后台页面通过chrome.tabs.sendMessage() 将消息重新发送到相应的选项卡。它看起来有点难看，但很有效。

2) 一个更好的，没有背景页面。扩展（弹出）页面为长期连接创建一个监听器。然后内容脚本向该连接发送一条消息。这里的一个问题是，在打开页面后没有立即创建侦听器，因此应该有一种机制让内容脚本等待弹出窗口加载。它可以是一个简单的setTimeout，也可以是通过相同的长期连接弹出的通知。

如果有人有更好的解决方案，我也很乐意去看看。