检索和修改 XMLHttpRequest 的内容

Question

我正在为 Firefox、Safari、Chrome 开发一个浏览器插件，它将拦截页面上的数据，针对正则表达式运行它，然后如果匹配 - 重新格式化它。我使用以下方法处理页面加载：

var meth = {
  replaceInElement : function(element, find, replace) {
        // iterate over child nodes and replace
  },
  run : function(evt){
    // doc is the document that triggered "run" event
    if (!(evt.target.nodeName === "#document")) { return; }
    var doc = evt.target; // document that triggered "onload" event
    if (!(doc instanceof HTMLDocument)) { return; }
    if (!doc.location) { return; }

    // perform substitutions on the loaded document
    var find = /regex/gi

    meth.replaceInElement(doc.body, find, function(match) {
        var new_content;
        //do stuff
        return new_content;
    });

    //content.document.addEventListener('DOMNodeInserted', ezcall.node_inserted, false);
  }
}

window.addEventListener("load", meth.run, false);

这适用于静态页面，但对于使用 ajax 调用的任何内容，它都会失败。我找不到合适的侦听器或弄清楚如何拦截 XMLHttpRequest。

我为 XMLHttpRequest 尝试了类似的事件侦听器，但没有成功。

XMLHttpRequest.addEventListener('load', meth.run, false);

我想拦截请求并修改内容。或者找到更新的目标，在ajax调用完成后扫描。

更新：

我会接受无法完成的回答，但我需要一些支持数据来说明为什么无法完成。

Answer 1

相当脏但你可以覆盖XMLHttpRequest.prototype.open。这是一个 Demo 页面。由于您正在编写扩展程序，因此您必须put this code in page context：

(function() {
    // save reference to the native method
    var oldOpen = XMLHttpRequest.prototype.open;
    // overwrite open with our own function
    XMLHttpRequest.prototype.open = function(method, url, async, user, pass) {
        // intercept readyState changes
        this.addEventListener("readystatechange", function() {
            // your code goes here...
            console.log("Interception :) " + this.readyState);
        }, false);
        // finally call the original open method
        oldOpen.call(this, method, url, async, user, pass);
    };
})();

在这之后你可以做任何我猜想的事情。替换instance.readystatechange，替换instance.addEventListener，或者监听突变事件（虽然它们是deprecated）。

Answer 2

我认为您无法以一般方式执行此操作。请记住，ajax 调用可以是任何格式（html、xml、json 等），然后启动它们的 javascript 可以在将数据插入文档之前对数据执行任何操作。您无法真正监控这一点，除非您针对特定情况执行此操作，并且您知道要查找什么。或者通过纯粹的蛮力，您可以跟踪页面的内容并定期检查是否有任何变化。

Answer 3

我不认为你可以这样做，即使你可以，还有其他加载aysnc内容的方法，例如JSON-P

另一种选择是设置一个函数来监视 body 元素是否有任何新添加到 DOM 中。我认为这不是本机浏览器事件，因此您必须使用 setTimeout() 进行轮询。另请注意，遍历所有 DOM 元素可能很耗时。以下页面包含一些可能有帮助的事件：http://www.quirksmode.org/dom/events/index.html