Может ли JQuery прослушивать вызовы AJAX из другого javascript?

Question

Мне нужно встроить функцию в корзину, которая использует AJAX для получения обновленной копии шаблона с сервера, когда что-то меняется (например, продукт удаляется). Я не могу изменить код на стороне сервера или JavaScript, который заставляет корзину работать в первую очередь. (Не идеально, я знаю, но так оно и есть)

Я хочу запускать свой собственный JavaScript каждый раз, когда корзина обновляется. Я хочу знать, можно ли прослушивать вызовы AJAX и запускать мой код каждый раз, когда он создается.

Answer 1

Чтобы выполнить все вызовы AJAX в HTML-документе, вы можете перезаписать прототип XMLHttpRequest.Таким образом, вы можете наблюдать за действиями с методами XMLHttpRequest объектов.

Вот небольшой пример кода:

var open = window.XMLHttpRequest.prototype.open,
    send = window.XMLHttpRequest.prototype.send,
    onReadyStateChange;

function openReplacement(method, url, async, user, password) {
    var syncMode = async !== false ? 'async' : 'sync';
    console.warn(
        'Preparing ' +
        syncMode +
        ' HTTP request : ' +
        method +
        ' ' +
        url
    );
    return open.apply(this, arguments);
}

function sendReplacement(data) {
    console.warn('Sending HTTP request data : ', data);

    if(this.onreadystatechange) {
        this._onreadystatechange = this.onreadystatechange;
    }
    this.onreadystatechange = onReadyStateChangeReplacement;

    return send.apply(this, arguments);
}

function onReadyStateChangeReplacement() {
    console.warn('HTTP request ready state changed : ' + this.readyState);
    if(this._onreadystatechange) {
        return this._onreadystatechange.apply(this, arguments);
    }
}

window.XMLHttpRequest.prototype.open = openReplacement;
window.XMLHttpRequest.prototype.send = sendReplacement;

В этом примере для каждого вызова AJAX вы будете иметьпредупреждение в консоли JavaScript.

Это не сценарий jQuery, но вы можете использовать jQuery внутри по своему усмотрению.

Это решение, вероятно, не будет работать в IE 6 или старше, но оно работаетFF, IE7 +, Chrome, Opera, Safari ...

Answer 2

Я бы предпочел это решение.

$(document).ajaxComplete(function(event,request, settings){
    // Your code here
});

Answer 3

Мой друг, вы можете сделать это очень легко с помощью Jquery (как вы сказали, вы используете Jquery)

(Для тех, кто не использует, они могут вбить код библиотеки Jquery в функции ajaxпросмотреть собственный код: '))

$(document).bind("ajaxSend", function(){
   $("#loading").show();
 }).bind("ajaxComplete", function(){
   $("#loading").hide();
 });

Это фрагмент кода, взятый из официальных документов API jquery (см. раздел «Глобальные события»)

https://api.jquery.com/Ajax_Events/

Answer 4

Вы не можете слушать это, но вы можете использовать плагин периодического обновления. Посмотрите на ниже:

http://plugins.jquery.com/plugin-tags/periodic-updater

Answer 5

Это тот же подход, что и добавление обратного вызова в прототипе XHR, но без установки каких-либо новых свойств в прототипе или написания нашего собственного механизма формирования событий. Я думаю, что это менее вероятно, чтобы вызвать конфликты.

(function() {
  // Reference to the original prototype method we're overriding
  var originalOpen = XMLHttpRequest.prototype.open;

  // Override prototype.open to add a custom callback whenever a request is opened
  XMLHttpRequest.prototype.open = function() {
    this.addEventListener('loadend', customCallback);

    // Execute the original prototype.open without affecting its execution context
    originalOpen.apply(this, arguments);
  };

  // All instances of XMLHttpRequest will execute this callback once on readyState 4
  var customCallback = function () {
    // In this context, `this` refers to the XHR instance that just completed
    console.log(this);

    // Remove the invoking listener to prevent duping on multiple calls to .open
    this.removeEventListener('loadend', customCallback);
  }
}());

Это не будет работать в IE <= 8 (без поддержки <code>.addEventListener())