跟踪XMLHTTPRequest结果

Question

I have a system built of many modules that use AJAX to do POSTs and GETs. If I monitor the results of these requests, I can know if the system is responsive - ie if the browser is still connected to the IP source.

I can by hand inject some callback methods in jQuery's AJAX .fail(). I have actually done this but it can be easy to forget and it adds a lot of extra code, as everything about this system requires AJAX.

I saw this interesting code to intercept XMLHTTPRequest open prototype method

(function(open) {
    XMLHttpRequest.prototype.open = function() {
        this.addEventListener("readystatechange", function() {
            console.log(this.readyState);
        }, false);
        open.apply(this, arguments);
    };
})(XMLHttpRequest.prototype.open);

I looked through the api, https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest, but I did not find somewhere that I could intercept success/failed/timed out requests. Is this possible?

Answer 1

It's all about listening to the appropriate events, they appear in the left sidebar in your link under "Events".

That said, I would consider using / taking some inspiration of zone.js.

A Zone is an execution context that persists across async tasks. You can think of it as thread-local storage for JavaScript VMs.