使用javascript进行Ajax/XMLHttpRequest跟踪

Question

我知道firebug可以跟踪页面上的所有Ajax/XHR事件.但是我需要准备一个工具,在已经存在的网页上按钮点击时自动跟踪这些调用.

我的网页的HTML和JS结构如下:

HTML:

<a href="javascript:void(0)" id="callButton" class=" call-btn " style="width: 30px;">Call</a>

JS:

scope: this,
id: 'callButton',
handler: function () {
    Ext.Ajax.request({
        url: '/Ajax/getCall/callUser/',
        params: {
            userID: usr.id
        },

任何人都可以建议如何在另一个JavaScript或其他东西的帮助下跟踪这个ajax调用？基本上我需要获得按钮单击时调用的内容,在此示例中:"/ Ajax/getCall/callUser /".它也适用于我页面上的所有按钮.

Answer 1

在脚本开头添加:

XMLHttpRequest.prototype.oldSend = XMLHttpRequest.prototype.send
XMLHttpRequest.prototype.send = function (data) {
    // there you can log requests
    console.log("AJAX request was sent.");
    this.oldSend.call(this, data);
}

这将创建对象的send方法副本,XMLHttpRequest并通过方法替换内部方法,您可以通过该方法记录AJAX请求,此方法调用发送AJAX请求的内部方法.

示例:http://jsfiddle.net/fgp783rz/1