谷歌chrome extension :: console.log()来自后台页面？

Question

如果我console.log('something');从弹出页面或其他任何脚本调用它,它可以正常工作.

但是,由于后台页面没有直接从弹出页面运行,因此它不包含在控制台中.

有没有办法让我可以console.log()在后台页面显示弹出页面的控制台？

有没有办法,从后台页面调用弹出页面中的一个函数？

Answer 1

如果单击扩展名列表中的"background.html"链接,则可以打开后台页面的控制台.

要访问与您的扩展程序对应的后台页面,请打开Settings / Extensions或打开新选项卡并输入chrome://extensions.你会看到这样的截图.

在您的扩展程序下单击链接background page.这将打开一个新窗口.对于上下文菜单示例,窗口具有标题:_generated_background_page.html.

Answer 2

任何扩展页面(内容脚本除外)都可以通过直接访问后台页面chrome.extension.getBackgroundPage().

这意味着,在弹出页面中,您可以这样做:

chrome.extension.getBackgroundPage().console.log('foo');

为了更容易使用:

var bkg = chrome.extension.getBackgroundPage();
bkg.console.log('foo');

现在,如果您想在内容脚本中执行相同操作,则必须使用Message Passing来实现此目的.原因是,它们都属于不同的领域,这是有道理的.Message Passing页面中有许多示例供您查看.

希望能清除一切.

Answer 3

要直接回答您的问题,当您console.log("something")从后台呼叫时,会将此消息记录到后台页面的控制台.要查看它,您可以转到chrome://extensions/并单击inspect view您的扩展名下的内容.

单击弹出窗口时,它会加载到当前页面中,因此console.log应在当前页面中显示日志消息.

Answer 4

您仍然可以使用console.log(),但它会被记录到单独的控制台中.要查看它 - 右键单击​​扩展图标并选择"检查弹出窗口".

Answer 5

最简单的解决方案是在文件顶部添加以下代码.而且您可以像平常一样使用所有完整的Chrome控制台API.

 console = chrome.extension.getBackgroundPage().console;
// for instance, console.assert(1!=1) will return assertion error
// console.log("msg") ==> prints msg
// etc

Answer 6

如果要登录活动页面的控制台,请尝试此操作:

chrome.tabs.executeScript({
    code: 'console.log("addd")'
});

Answer 7

2022 年更新：使用 Manifest 3 和 Service Worker，您只需点击 chrome://extensions扩展details上的按钮，找到：Inspect Views-> Service Worker。

Answer 8

const log = chrome.extension.getBackgroundPage().console.log;
log('something')

打开日志：

• 打开：chrome：// extensions /
• 详细信息>背景页面