时间戳

首页 > 解决方案 > 通过 chrome 扩展访问控制台日志命令

javascript - 通过 chrome 扩展访问控制台日志命令

问题描述

我希望通过我的 Chrome 扩展程序覆盖现有的控制台命令 - 这样做的原因是我希望记录特定站点的控制台日志。

不幸的是，我似乎无法更新 DOM，这是我迄今为止尝试过的：

// Run functions on page change
chrome.tabs.onUpdated.addListener( function (tabId, changeInfo, tab) {
    var s = document.createElement('script');
    // TODO: add "script.js" to web_accessible_resources in manifest.json
    s.src = chrome.runtime.getURL('core/js/app/console.js');
    s.onload = function() {
        this.remove();
    };
    (document.head || document.documentElement).appendChild(s);
});

控制台.js

// Replace functionality of console log
console.defaultLog = console.log.bind(console);
console.logs = [];
console.log = function(){
    console.defaultLog.apply(console, arguments);
    console.logs.push(Array.from(arguments));
};

// Replace functionality of console error
console.defaultError = console.error.bind(console);
console.errors = [];
console.error = function(){
    console.defaultError.apply(console, arguments);
    console.errors.push(Array.from(arguments));
};

// Replace functionality of console warn
console.defaultWarn = console.warn.bind(console);
console.warns = [];
console.warn = function(){
    console.defaultWarn.apply(console, arguments);
    console.warns.push(Array.from(arguments));
};

// Replace functionality of console debug
console.defaultDebug = console.debug.bind(console);
console.debugs = [];
console.debug = function(){
    console.defaultDebug.apply(console, arguments);
    console.debugs.push(Array.from(arguments));
};

该脚本使用 alert() 成功运行。

我的目标是访问 console.logs - 但它未定义，这意味着我无法访问 DOM，尽管注入了脚本。

如果不可能，即使是第三方集成也会有所帮助，即 Java 或 C？

任何想法将不胜感激:)

标签： javascriptgoogle-chromedomgoogle-chrome-extensionconsole

解决方案

我找到了这篇文章，我认为 Tampermonkey 注入了一个带有您在 Tampermonkey Chrome 扩展页面中添加的即时功能的脚本，我在 Wappalyzer 之类的扩展中发现了类似的东西，并且看起来不错且安全，您可以使用WebRequest向您的网站注入如帖子所述，在页面完全加载之前的新“polyfill”。

这里是我之前提到的Wappalyzer的示例，这是使用代码注入使用 Wappalyzer 在 StackOverflow 中加载 JS，我还没有使用 Tampermonkey 进行测试

在此处输入图像描述

编辑

检查 Wappalyzer，如何注入代码是简单的部分，您可以使用（Wappalyzer github 示例）：

const script = document.createElement('script')
script.setAttribute('src', chrome.extension.getURL('js/inject.js'))

这可能无法解决您的问题，此代码在所有内容加载到 DOM 后执行。但是，您可以在这篇文章中找到解决该问题的方法

我会建议使用 onCommitted 事件（doc1 / doc2）

使用 mozilla.org 示例，您将拥有类似

 const filter = {
  url: //website to track logs
  [
    {hostContains: "example.com"},
    {hostPrefix: "developer"}
  ]
}

function logOnCommitted(details) {
  //Inject Script on webpage
}

browser.webNavigation.onCommitted.addListener(logOnCommitted, filter);

推荐阅读