Chrome:获取活动的标签控制台输出? [英] Chrome: Get active tab console output?

问题描述

我正在创建一个自定义的Chrome扩展程序，它将在将活动标签发送到辅助网站之前检索有关活动标签的数据.

I'm creating a custom Chrome extension, which is going to retrieve data about an active tab before sending it to a secondary website.

我一直在尝试找到一种方法，该方法如何检索活动选项卡的控制台输出.首先，chrome.tabs.getSelected似乎很有希望，但是，它不提供控制台文本的输出.我已经辛苦了几个小时，没有找到一种可以为我提供此信息的方法.

I've been trying to find a method on how to retrieve the console output for an active tab. chrome.tabs.getSelected seemed promising at first, however, it doesn't offer an output of the console text. I've been digging for couple of hours without much success of finding a method that could give me this info.

有人可以指出我的正确方向吗?

Could anyone point me in the right direction please?

作为跟踪到目前为止我已经尝试过的所有方法的一种方法，对于我自己和其他人，我将在下面添加信息.

我找到了可能对我有用的解决方案.下面的代码将扩展控制台方法log，error和warn.我目前正在研究一种方法，可以将该代码附加到活动选项卡上，以便我可以将阵列中的控制台输出收集起来，然后在我的扩展程序中将其输出以发送到辅助网站.

I've found a possible solution which may work for me. The below code will extend the console methods log, error and warn. I'm currently researching for a method that maybe able to attach this code to the active tab, so I can collect the console outputs in the arrays and then make these available on my extension to be sent over to the secondary website.

我将在发布过程中发布更多信息.

I will post more info as I progress through it.

var logs = [],
    cLogs = [],
    cErrors = [],
    cWarns = [],
    _log = console.log,
    _error = console.error,
    _warn = console.warn;

console.log = function () {
    for (var i = 0; i < arguments.length; i++) {
        logs.push(arguments[i]);
        cLogs.push(arguments[i]);
    }

    _log.apply(this, arguments);
};

console.error = function () {
    for (var i = 0; i < arguments.length; i++) {
        logs.push(arguments[i]);
        cErrors.push(arguments[i]);
    }

    _error.apply(this, arguments);
};

console.warn = function () {
    for (var i = 0; i < arguments.length; i++) {
        logs.push(arguments[i]);
        cWarns.push(arguments[i]);
    }

    _warn.apply(this, arguments);
};

console.log('welcome');
console.error({'foobar': ['foo','bar']});
console.warn({'foo':'bar'});

_log(logs);

推荐答案

此问题比看起来要难得多.

This issue is significantly harder than it appears.

API不能访问选项卡的控制台.实际上，没有标准"的规定. API可以.

APIs like chrome.tabs have no access to a tab's console. In fact, no "standard" API does.

可以期望在页面上下文中运行的内容脚本访问它.但是，无法从JavaScript上下文访问控制台的先前输出.

One could expect a content script running in the context of the page to be able to access it. However, there's no way to access previous output of the console from a JavaScript context.

您在更新中引用的方法(围绕console.*函数创建包装器)只能捕获这些函数的将来调用，而不能捕获JS运行时本身的错误(例如未处理的异常或网络错误)之类的东西.因此，要从任意选项卡访问控制台，即使您很少使用它，也需要在加载之前将代码注入每个选项卡.

The method you quote in your update (creating wrappers around console.* functions) can only capture future invocations of those functions, and won't capture things like errors from the JS runtime itself (e.g. unhandled exceptions or network errors). As such, to access console from an arbitrary tab, you'll need to inject this code into every tab, before it loads, even if you only rarely use it.

由于内容脚本实际上无法运行，这使情况更加复杂在相同的上下文中.要覆盖页面本身的console，您需要

It is further complicated by the fact that content scripts do not, in fact, run in the same context. To override console for the page itself, you'll need to inject the script in the page context.

因此，总结一下:

1. 您可以通过覆盖console.*函数并侦听window对象上的error事件来做到这一点，但这必须在本身将是一个挑战.

1. You can do it by overriding console.* functions and listening to error event on window object, but it has to be done in page context by a document_start content script injecting code into every page. Extracting this data from the page context will be a challenge in itself.

缺点:

• 这会损害浏览器的整体性能.
• 它不会看到一些由浏览器启动的消息直接 进入控制台.

• It hurts overall browser performance.
• It won't see some browser-initiated messages that go directly to console.

您可以放下重锤并使用 chrome.debugger API .该API对页面的访问级别与开发工具本身相同，因此可以获取完整的控制台输出历史记录.

You can take the big hammer and use chrome.debugger API. This API has the same level of access to the page as the Dev Tools themselves - therefore, it's possible to obtain the full console output history.

缺点:

• 您需要研究远程调试协议，请参阅官方示例.
• 使用调试器API时，所有选项卡中都会显示一个非常可怕的警告.

• You'll need to study the remote debugging protocol, see the official examples.
• A very scary warning will be shown in all tabs when the debugger API is used.

总而言之，您要实现的目标是使用脆弱的解决方案来完成一项艰巨的任务.也许您需要重新考虑您的方法.

All in all, what you're trying to achieve is a hard task with fragile solutions. Perhaps you need to rethink your approach.

这篇关于Chrome:获取活动的标签控制台输出?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！