使用JavaScript刮擦/窃听AJAX数据？

Question

是否可以使用JavaScript来清除对使用AJAX进行实时更新的网页的所有更改？我希望每秒使用AJAX抓取更新数据的网站,我想抓住所有的变化.这是一个拍卖网站,只要用户出价,就可以更改多个对象.出价时,进行以下更改:

当前买入价当前高出价者拍卖定时器已将时间添加回其中

我希望使用基于JavaScript构建的Chrome扩展程序获取此数据.是否有JavaScript的AJAX监听器可以实现这一目标？工具包？我需要一些方向.JavaScript可以实现这个吗？

Answer 1

我将展示两种解决问题的方法.无论您选择哪种方法,都不要忘记阅读我的答案的底部!

首先,我提出一个简单的方法,只有在页面使用jQuery时才有效.第二种方法看起来稍微复杂一些,但也适用于没有jQuery的页面.

以下示例显示了如何基于方法(例如POST/GET),URL和读取(POST)数据以及响应主体实现过滤器.

在jQuery中使用全局ajax事件

有关jQuery方法的更多信息可以在文档中找到.ajaxSuccess.用法:

jQuery.ajaxSuccess(function(event, xhr, ajaxOptions) {
    /* Method        */ ajaxOptions.type
    /* URL           */ ajaxOptions.url
    /* Response body */ xhr.responseText
    /* Request body  */ ajaxOptions.data
});

纯JavaScript方式

当网站不为其AJAX请求使用jQuery时,您必须修改内置XMLHttpRequest方法.这需要更多代码...:

(function() {
    var XHR = XMLHttpRequest.prototype;
    // Remember references to original methods
    var open = XHR.open;
    var send = XHR.send;

    // Overwrite native methods
    // Collect data: 
    XHR.open = function(method, url) {
        this._method = method;
        this._url = url;
        return open.apply(this, arguments);
    };

    // Implement "ajaxSuccess" functionality
    XHR.send = function(postData) {
        this.addEventListener('load', function() {
            /* Method        */ this._method
            /* URL           */ this._url
            /* Response body */ this.responseText
            /* Request body  */ postData
        });
        return send.apply(this, arguments);
    };
})();

让它在Chrome扩展程序中运行

之前显示的代码必须在页面的上下文中运行(在您的情况下,是拍卖页面).因此,必须使用内容脚本来注入(!)脚本.使用这个并不困难,我参考这个答案的详细解释和使用示例:构建Chrome扩展 - 使用内容脚本在页面中注入代码.

一般方法

您可以使用chrome.webRequestAPI 读取请求正文,请求标头和响应标头.标题也可以修改.然而,它(还)不可能读取,更不用说修改请求的响应主体了.如果您需要此功能,请访问https://code.google.com/p/chromium/issues/detail?id=104058.