我有一个chrome扩展程序,可以通过以下方式传递信息: 1. content.js分析页面并将结果发送到background.js 2. popup.js从background.js查询结果并将其显示在popup.html中。
预期的行为::每次用户单击弹出按钮时,他都会看到当前选项卡的分析数据。
当前行为:每次用户单击弹出按钮时,他都会看到其分析的第一个选项卡的分析数据。
我尝试使用chrome.tabs.query,但无法弄清楚。去这里要走什么路?
Content.js (将DOM发送到后台)
var fromDOM = new XMLSerializer().serializeToString(document);
console.log(fromDOM);
chrome.runtime.sendMessage({method:'setTitle',title:fromDOM});
Background.js (内容和弹出窗口之间的代理)
var title;
chrome.runtime.onMessage.addListener(function(message,sender,sendResponse){
if(message.method == 'setTitle')
title = message.title;
else if(message.method == 'getTitle')
sendResponse(title);
});
popup.js (显示DOM)
chrome.runtime.sendMessage({method:'getTitle'}, function(response){
document.querySelector("p").textContent = response;
});
清单
{
"manifest_version": 2,
"name": "B",
"version": "0.1",
"options_page": "options.html",
"background" : {
"scripts": ["background.js"]
},
"permissions": [
"storage",
"tabs"
],
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": ["content.js"],
"run_at": "document_end"
}
]
}