如果我调用console.log('something');从弹出页面,或任何脚本,包括它的工作良好。
然而,由于后台页面不是直接运行弹出页面,它不包括在控制台。
是否有一种方法,我可以得到console.log()的后台页面显示在控制台的弹出页面?
有没有办法从后台页面调用弹出页面中的函数?
如果我调用console.log('something');从弹出页面,或任何脚本,包括它的工作良好。
然而,由于后台页面不是直接运行弹出页面,它不包括在控制台。
是否有一种方法,我可以得到console.log()的后台页面显示在控制台的弹出页面?
有没有办法从后台页面调用弹出页面中的函数?
当前回答
目前使用Manifest 3和service worker,你只需要进入扩展页面/详细信息,然后单击Inspect Views / service worker。
其他回答
任何扩展页面(除了内容脚本)都可以通过chrome.extension.getBackgroundPage()直接访问后台页面。
这意味着,在弹出页面中,你可以这样做:
chrome.extension.getBackgroundPage().console.log('foo');
使它更容易使用:
var bkg = chrome.extension.getBackgroundPage();
bkg.console.log('foo');
现在如果你想在内容脚本中做同样的事情,你必须使用消息传递来实现这一点。原因是,它们属于不同的领域,这说得通。在“消息传递”页面中有许多示例供您查看。
希望这一切都清楚了。
const log = chrome.extension.getBackgroundPage().console.log;
log('something')
打开日志:
开放:chrome: / / extensions / 详细信息>背景页面
要在调试chrome扩展时查看控制台,您应该使用chrome.extension. getbackgroundpage ();API,之后你可以像往常一样使用console.log():
chrome.extension.getBackgroundPage().console.log('Testing');
这是很好的,当你使用多个时间,所以你创建自定义函数:
const console = {
log: (info) => chrome.extension.getBackgroundPage().console.log(info),
};
console.log("foo");
你只在任何地方使用console.log('learnin')
我得到null
根据文件,
MV3中的后台页面由service worker替换。 更换背景。页面或背景。带有背景的脚本。manifest.json中的Service_worker。注意,service_worker字段接受一个字符串,而不是字符串数组。
manifest.json
{
"manifest_version": 3,
"name": "",
"version": "",
"background": {
"service_worker": "background.js"
}
}
无论如何,我不知道如何使用getBackgroundPage,但我找到了另一个解决方案如下,
解决方案
使用chrome.scripting.executeScript
因此您可以注入任何脚本或文件。可以直接点击inspect (F12)进行功能调试。
例如
chrome.commands.onCommand.addListener((cmdName) => {
switch (cmdName) {
case "show-alert":
chrome.storage.sync.set({msg: cmdName}) // You can not get the context on the function, so using the Storage API to help you. // https://developer.chrome.com/docs/extensions/reference/storage/
chrome.tabs.query({active: true, currentWindow: true}).then(([tab])=>{
chrome.scripting.executeScript({
target: {tabId: tab.id},
function: () => {
chrome.storage.sync.get(['msg'], ({msg})=> {
console.log(`${msg}`)
alert(`Command: ${msg}`)
})
}
})
})
break
default:
alert(`Unknown Command: ${cmdName}`)
}
})
我创建了一个开源供你参考。
要从后台页面获取控制台日志,您需要在后台页面background.js中编写以下代码片段。
chrome.extension.getBackgroundPage().console.log('hello');
然后加载扩展并检查其后台页面以查看控制台日志。