javascript - 从浏览器扩展覆盖 JavaScript 函数

Question

我正在创建 a web extension帮助检测网站中的 postMessage 事件。因此，我想在页面附加 message 时检测它。事件监听器，例如通过调用以下代码:

window.addEventListener("message", ...)

显然不可能获得事件监听器的列表。我的下一个想法是覆盖 addEventListener ，所以我可以检测到对它的调用:

window.addEventListener = function(type) {
    if (type == "message") {
        // do something
    }
}

我无法将此代码注入(inject)页面:

内容脚本可以访问每个页面的 DOM，但不能访问窗口对象。更改内容页面上的 window.addEventListener 对实际页面没有影响。

我可以通过修改 DOM 添加一个脚本元素，但我无法正确把握时机。我的脚本需要在任何其他脚本之前运行，并且此方法仅在已经存在 DOM 时才有效。

chrome.tabs.executeScript 之类的函数在特定选项卡上工作，我想在每个页面上运行代码。如果页面有 iframe，这会有所不同，我还想覆盖 addEventListener。

如何从我的扩展程序全局覆盖 window.addEventListener？或者，是否有另一种方法可以检测 message 上的事件监听器？事件？

Answer 1

要覆盖函数，您需要在页面加载之前运行 JavaScript。您需要执行以下操作:

在 manifest.json 中，通过设置 run_at 指定在加载文档之前运行内容脚本至document_start .

从内容脚本中，将静态代码注入(inject)页面。不要使用 URL，而是创建一个包含代码的脚本标记。 IE。 script.textContent = actualCode而不是 script.src = url .