使用javascript进行Ajax / XMLHttpRequest跟踪 [英] Ajax / XMLHttpRequest tracking using javascript

问题描述

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

I know firebug can trace all the Ajax/XHR events on a page. But I need to prepare a tool which automatically tracks these calls on button clicks on an already existing webpage.

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

My webpage's HTML and JS structure are follows:

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 /它也适用于我页面上的所有按钮。

Can anyone suggest how to track this ajax calls with the help of another javascript or something? Basically i need to get what is called on button click, in this example: "/Ajax/getCall/callUser/". It should work with all buttons on my page as well.

推荐答案

在脚本开头添加：

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);
}

这会创建发送 上的方法XMLHttpRequest 对象和内部方法替换方法，您可以通过该方法记录AJAX请求，此方法调用内部方法发送AJAX请求。

This creates copy of send method on XMLHttpRequest object and internal method replaces by method where you can log AJAX requests and this method call the internal method whitch send AJAX request.

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

这篇关于使用javascript进行Ajax / XMLHttpRequest跟踪的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！