AJAX request hits server from every page and I can't find the source of that original AJAX call

问题

Somewhere in my thousands of lines of javascript, an ajax call is being made. I cannot for the life of me figure out where it is coming from. It seems to happen right after a page loads.

I can see in firebug that the ajax call is being made. The ajax call always requests the current page. So, for example, once users#new loads, it asks for users#new.js and also does the same with every other controller and action.

Is there a way I can determine where in the code it is being called from?

回答1:

In your JavaScript console, you could override XMLHttpRequest.send() with your own implementation and set a break point there so you can examine the stack trace in the debugger when it is called.

var send = XMLHttpRequest.prototype.send;
XMLHttpRequest.prototype.send = function () {
    send.apply(this, arguments); // set break point here
};

回答2:

Although you've already found a solution, you could still remedy the situation using the debugger. Let's say you were using jQuery and its AJAX helpers, simply set a breakpoint in the first line of the $.ajax method.

When a call is made to $.ajax, the runtime will halt at the breakpoint and you can look at the call stack to figure out exactly where the call came from.

If you were using the XMLHttpRequest constructor directly instead of via jQuery or some other wrapper, then replace the original XMLHttpRequest constructor function with a dummy implementation for the purpose of tracing its caller.

function XMLHttpRequest() {
    this.open = function() {}; // ignore
    this.send = function() {
        debugger;
    };
}

Place a breakpoint or invoke the debugger programmatically in the send method of this overridden implementation, and whenever somebody tries to instantiate a new XMLHttpRequest object and call the send method, you can intercept the call and look at the call trace to figure out who made the call.

There are plenty of good debugging options like Firebug for Firefox, or the built-in Developer Tools in Chrome and Safari.