Javascript 谷歌浏览器扩展 :: console.log() 来自后台页面？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3829150/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
google chrome extension :: console.log() from background page?
提问by Hailwood
If I call console.log('something');from the popup page, or any script included off that it works fine.
如果我console.log('something');从弹出页面调用或包含任何脚本，它可以正常工作。
However as the background page is not directly run off the popup page it is not included in the console.
但是，由于后台页面不是直接从弹出页面运行的，因此它不包含在控制台中。
Is there a way that I can get console.log()'s in the background page to show up in the console for the popup page?
有没有办法让console.log()'s 在后台页面中显示在弹出页面的控制台中？
is there any way to, from the background page call a function in the popup page?
有什么办法可以从后台页面调用弹出页面中的函数吗？
采纳答案by Mohamed Mansour
Any extension page(except content scripts) has direct access to the background page via chrome.extension.getBackgroundPage().
任何扩展页面（内容脚本除外）都可以通过chrome.extension.getBackgroundPage().
That means, within the popup page, you can just do:
这意味着，在弹出页面中，您可以执行以下操作：
chrome.extension.getBackgroundPage().console.log('foo');
To make it easier to use:
为了更容易使用：
var bkg = chrome.extension.getBackgroundPage();
bkg.console.log('foo');
Now if you want to do the same within content scriptsyou have to use Message Passingto achieve that. The reason, they both belong to different domains, which make sense. There are many examples in the Message Passingpage for you to check out.
现在如果你想在内容脚本中做同样的事情，你必须使用消息传递来实现这一点。究其原因，它们都属于不同的领域，这是有道理的。消息传递页面中有许多示例供您查看。
Hope that clears everything.
希望能清除一切。
回答by serg
You can open the background page's console if you click on the "background.html" link in the extensions list.
如果您单击扩展列表中的“background.html”链接，您可以打开后台页面的控制台。
To access the background page that corresponds to your extensions open Settings / Extensionsor open a new tab and enter chrome://extensions. You will see something like this screenshot.
要访问与您的扩展程序对应的后台页面，请打开Settings / Extensions或打开一个新选项卡并输入chrome://extensions. 您将看到类似此屏幕截图的内容。
Under your extension click on the link background page. This opens a new window.
For the context menu samplethe window has the title: _generated_background_page.html.
在您的扩展程序下单击链接background page。这会打开一个新窗口。对于上下文菜单示例，窗口的标题为：_generated_background_page.html。
回答by songyy
To answer your question directly, when you call console.log("something")from the background, this message is logged, to the background page's console. To view it, you may go to chrome://extensions/and click on that inspect viewunder your extension.
要直接回答您的问题，当您console.log("something")从后台调用时，此消息会被记录到后台页面的控制台。要查看它，您可以转到chrome://extensions/并单击inspect view扩展程序下的那个。
When you click the popup, it's loaded into the current page, thus the console.log should show log message in the current page.
当您单击弹出窗口时，它会加载到当前页面中，因此 console.log 应在当前页面中显示日志消息。
回答by Lacho Tomov
You can still use console.log(), but it gets logged into a separate console. In order to view it - right click on the extension icon and select "Inspect popup".
您仍然可以使用 console.log()，但它会登录到单独的控制台。为了查看它 - 右键单击扩展图标并选择“检查弹出窗口”。
回答by dd .
The simplest solution would be to add the following code on the top of the file. And than you can use all full Chrome console apias you would normally.
最简单的解决方案是在文件顶部添加以下代码。而且您可以像往常一样使用所有完整的Chrome 控制台 API。
console = chrome.extension.getBackgroundPage().console;
// for instance, console.assert(1!=1) will return assertion error
// console.log("msg") ==> prints msg
// etc
回答by O Fallante
const log = chrome.extension.getBackgroundPage().console.log;
log('something')
Open log:
打开日志：
- Open: chrome://extensions/
- Details > Background page
- 打开：chrome://extensions/
- 详情 > 背景页面
回答by Faz
Try this, if you want to log to the active page's console:
试试这个，如果你想登录到活动页面的控制台：
chrome.tabs.executeScript({
code: 'console.log("addd")'
});
回答by Denis G.
It's an old post, with already good answers, but I add my two bits. I don't like to use console.log, I'd rather use a logger that logs to the console, or wherever I want, so I have a module defining a log function a bit like this one
这是一篇旧帖子，已经有了很好的答案，但我添加了两点。我不喜欢使用console.log，我宁愿使用记录到控制台或任何我想要的地方的记录器，所以我有一个模块定义了一个有点像这样的日志功能
function log(...args) {
console.log(...args);
chrome.extension.getBackgroundPage().console.log(...args);
}
When I call log("this is my log") it will write the message both in the popup console and the background console.
当我调用 log("this is my log") 时，它将在弹出控制台和后台控制台中写入消息。
The advantage is to be able to change the behaviour of the logs without having to change the code (like disabling logs for production, etc...)
优点是无需更改代码即可更改日志的行为（例如禁用生产日志等...）
回答by WoodrowShigeru
In relation to the original question I'd like to add to the accepted answer by Mohamed Mansour that there is also a way to make this work the other way around:
关于最初的问题，我想在 Mohamed Mansour 接受的答案中补充一点，还有一种方法可以使这项工作反过来：
You can access other extension pages (i.e. options page, popup page) from within the background page/scriptwith the chrome.extension.getViews()call. As described here.
您可以访问其他扩展页（即选项页，弹出页）背景页/脚本中使用的chrome.extension.getViews()电话。如上所述这里。
// overwrite the console object with the right one.
var optionsPage = ( chrome.extension.getViews()
&& (chrome.extension.getViews().length > 1) )
? chrome.extension.getViews()[1] : null;
// safety precaution.
if (optionsPage) {
var console = optionsPage.console;
}
回答by Anushka Rai
To get a console log from a background page you need to write the following code snippet in your background page background.js -
要从后台页面获取控制台日志，您需要在后台页面 background.js 中编写以下代码片段 -
chrome.extension.getBackgroundPage().console.log('hello');
chrome.extension.getBackgroundPage().console.log('hello');
Then load the extension and inspect its background page to see the console log.
然后加载扩展并检查其背景页面以查看控制台日志。
Go ahead!!
前进！！
