Estoy creando una aplicación web con diferentes bibliotecas JS (AngularJS, OpenLayers, ...) y necesito una forma de interceptar todas las respuestas AJAX para poder, en caso de que la sesión de usuario registrada expire (la respuesta vuelve con401 Unauthorized estado), para redirigirlo a la página de inicio de sesión.

Sé que AngularJS ofreceinterceptors para administrar tales escenarios, pero no fue capaz de encontrar una manera de lograr esa inyección en las solicitudes de OpenLayers. Así que opté por un enfoque vanilla JS.

aquí Encontré este fragmento de código ...

(function(open) {

    XMLHttpRequest.prototype.open = function(method, url, async, user, pass) {

        this.addEventListener("readystatechange", function() {
            console.log(this.readyState); // this one I changed
        }, false);

        open.call(this, method, url, async, user, pass);
    };

})(XMLHttpRequest.prototype.open);

... que adapté y parece que se comporta como se esperaba (solo lo probé en el último Google Chrome).

Como modifica el prototipo de XMLHTTPRequest, me pregunto qué tan peligroso podría resultar esto o si podría producir serios problemas de rendimiento. ¿Y por cierto habría alguna alternativa válida?

Actualización: cómo interceptar solicitudes antes de que se envíen

El truco anterior funciona bien. Pero, ¿qué pasa si en el mismo escenario desea inyectar algunos encabezados antes de que se envíe la solicitud? Haz lo siguiente:

(function(send) {

    XMLHttpRequest.prototype.send = function(data) {

        // in this case I'm injecting an access token (eg. accessToken) in the request headers before it gets sent
        if(accessToken) this.setRequestHeader('x-access-token', accessToken);

        send.call(this, data);
    };

})(XMLHttpRequest.prototype.send);