Ajouter un "hook" à toutes les requêtes AJAX sur une page

Question

Je voudrais savoir s'il est possible de "crocheter" dans chaque demande AJAX (soit avant qu'elle ne soit envoyée, soit lors d'événements) et d'effectuer une action. À ce stade, je suppose qu'il y a d'autres scripts tiers sur la page. Certains d'entre eux pourraient utiliser jQuery, tandis que d'autres non. Est-ce possible ?

Answer 1

En utilisant la réponse de "meouw", je suggère d'utiliser la solution suivante si vous voulez voir les résultats de la requête

function addXMLRequestCallback(callback) {
    var oldSend, i;
    if( XMLHttpRequest.callbacks ) {
        // nous avons déjà remplacé send() donc ajoutons simplement le callback
        XMLHttpRequest.callbacks.push( callback );
    } else {
        // créer une file d'attente de callback
        XMLHttpRequest.callbacks = [callback];
        // stocker le send() natif
        oldSend = XMLHttpRequest.prototype.send;
        // remplacer le send() natif
        XMLHttpRequest.prototype.send = function() {
            // appeler le send() natif
            oldSend.apply(this, arguments);

            this.onreadystatechange = function ( progress ) {
               for( i = 0; i < XMLHttpRequest.callbacks.length; i++ ) {
                    XMLHttpRequest.callbacks[i]( progress );
                }
            };       
        }
    }
}

addXMLRequestCallback( function( progress ) {
    if (typeof progress.srcElement.responseText != 'undefined' &&                        progress.srcElement.responseText != '') {
        console.log( progress.srcElement.responseText.length );
    }
});

Answer 2

En plus de la réponse de meouw, j'ai dû injecter du code dans un iframe qui intercepte les appels XHR, et j'ai utilisé la réponse ci-dessus. Cependant, j'ai dû changer

XMLHttpRequest.prototype.send = function(){

À :

XMLHttpRequest.prototype.send = function(body)

Et j'ai dû changer

oldSend.apply(this, arguments);

À :

oldSend.call(this, body);

Cela était nécessaire pour le faire fonctionner dans IE9 avec le mode document IE8. Si cette modification n'avait pas été faite, certains retours d'appel générés par le framework de composants (Visual WebGUI) ne fonctionnaient pas. Plus d'informations sur ces liens :

• Function.prototype.call
• Function.prototype.apply

Sans ces modifications, les retours d'appels AJAX ne se terminaient pas.

Answer 3

Jquery...

   $(document).ajaxSuccess(
        function(event, xhr, settings){ 
          alert(xhr.responseText);
        }
   );

Answer 4

Découvrez les événements ajax de jquery. Vous pouvez faire ceci :

$(document).on("ajaxSend", function (e) {
    console.log("avant l'envoi de la requête");
}).on("ajaxComplete", function (e) {
    console.log("après le succès ou l'erreur");
}).on("ajaxSuccess ", function (e) {
    console.log("sur succès");
}).on("ajaxError ", function (e) {
    console.log("sur erreur");
});