如何将消息从内容脚本发送到非活动弹出窗口，Chrome扩展

Question

我想将任何网页上的文本（使用内容脚本来处理选择）记录到弹出资源的数据库中，以便在一个地方收集文本。

我在尝试什么 我在弹出页面中创建了一个数据库并尝试通过内容脚本来管理它，虽然弹出窗口没有活动（未打开），但是无法使弹出窗口接收来自内容脚本的任何消息。

我不确定使用消息传递来解决这个问题。 有没有更好的解决方案？

Answer 1

内容脚本无法向不可见的弹出窗口发送消息，因为弹出窗口的上下文在隐藏时处于非活动状态（已关闭）。

您的问题有几种解决方案。

选项1：没有消息传递，使用存储事件

如果您的“数据库”实际上是一个简单的键值存储，请切换到chrome.storage API。此API可用于内容脚本和弹出窗口，并附带一个事件以通知您值的更改。

示例：

// Get notified of changes (in the popup?)
chrome.storage.onChanged.addListener(function(changes, areaName) {
    // Do whatever you want with the changes.
});
// Initialization of the popup (print initial information?)
chrome.storage.local.get({keyName: 'defaultValue'}, function(items) {
    // Do something with items.keyName
});

// Content script, storage (remember document title?)
chrome.storage.local.set({keyName: document.title});

选项2：将消息传递到后台/事件页面

弹出式窗口和background / event页面共享相同的过程。与弹出窗口关联的任何数据库也可用于后台页面，反之亦然。这种方法的高级概述：

1. 内容脚本将消息发送到后台页面。
2. 后台页面将值存储在数据库中
3. 如果弹出窗口已打开，请更新弹出窗口的视图。
4. 如果弹出窗口打开^{（之前它已关闭）}，它应该读取数据库（直接或通过使用chrome.runtime.getBackgroundPage从后台页面读取数据）并处理结果。

我在this answer中提供了与此流程相对应的代码。