javascript - 无法从内容脚本与 Chrome 扩展程序中的弹出窗口进行通信
问题描述
我正在尝试我的第一个 Chrome 扩展程序。
我偶然发现了一个问题,我无法从内容脚本到弹出窗口进行通信。
上下文:
我的弹出窗口包含一些我想在页面的刷新/初始化时从内容脚本中检索的 localStorage 数据,以便我可以在页面上使用该数据。
如果我正确理解官方文档,这应该是可能的。
它说:
“从内容脚本发送请求如下所示:”
chrome.runtime.sendMessage({greeting: "hello"}, function(response) {
console.log(response.farewell);
});
所以我已经尝试过了,我可以看到上面的代码是从我注入的 JS 脚本(内容脚本)触发的,但我猜我在弹出窗口中没有正确“监听”它。
这是我的代码:
内容脚本(函数在运行时运行)
function getLocalStorageItems() {
chrome.runtime.sendMessage({task: "retrieve-local"}, function(response)
{
console.log(response.farewell);
});
}
我已尽可能完整地保留示例函数。
弹出js
chrome.runtime.onMessage.addListener((request, sender, sendResponse) =>
{
if ( request.task == "retrieve-local" ) {
console.log('retrieve-local');
}
});
显现
{
"manifest_version": 2,
"name": "Maxxton Dev Extension",
"description": "Extension for Maxxton Developers",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "index.html"
},
"content_scripts": [
{
"matches": ["*://*/*"],
"js": ["injected.js"],
"run_at": "document_end"
}
]
}
我从未在弹出窗口中看到 console.log 被注册。
我认为这可能与我正在尝试的事实有关,chrome.runtime.onMessage
因为从弹出窗口发送消息是chrome.tabs.query
. 所以我尝试将其更改为chrome.tabs.onMessage
,但这也没有做任何事情。
现在我认为这甚至不可能,因为弹出窗口处于休眠/不活动状态。但我不确定。我找不到关于这个问题的任何信息。
解决方案
我用背景脚本完成了这项工作。我不知道“browser_action”是如何工作的,但是当我尝试使用“page_action”时,我注意到每当我单击按钮时都会重新创建页面(因此,如果当前没有弹出,它可能不存在并且不会在监听)。
我建议您将数据保留在后台,并使内容和弹出窗口都与后台通信。
添加到您的清单:
"background": {
"scripts": [
//"you_probably_have_something_here_to_register_browser_action?",
"background_data_manager.js", //this will be your script to manage data
],
"persistent": false
},
将您的侦听器和所有处理数据的代码放入文件background_data_manater.js
中。
要访问后台控制台,请转到 Chrome 工具并打开开发人员模式的扩展页面。您将在那里看到一个关于您的扩展中的视图的小链接。此链接打开后台控制台。
您应该在该控制台中看到预期的日志。
推荐阅读
- reactjs - 单选按钮的反应组件
- node.js - 如何让宿主使用应用的生产构建文件夹?
- python - NameError:名称'input_shape'未定义,同时在keras中创建顺序模型
- android - 工具栏部分显示在横向视图中
- installation - 在编译和实际运行时调用了哪些部分
- amazon-web-services - 我可以看到我在 AWS EC2 实例上上传的文件
- r - 如何反转 RasterVis (Levelplot) 的默认颜色?
- django - 在视图功能上添加 transaction.atomic 时 Django 无法识别视图
- swift - 枚举文件系统性能
- javascript - Discord.js v12 表情符号列表命令