Блог

Главная - Вопросы по программированию - jQuery прерывает вызовы ajax, которые не работают должным образом

jQuery прерывает вызовы ajax, которые не работают должным образом

#javascript #jquery #ajax

Вопрос:

Я пытаюсь прервать все ожидающие вызовы ajax, если нажму кнопку. У меня есть следующие коды javascript.

 var MyApp = function() {
    this.xhrPool = [];
}

MyApp.constructor = MyApp;

MyApp.prototype.fetchDataFromApi = function() {
    var rows = $("tr.data-row");

    var _obj = this;

    rows.each(function(index, rowData){
        $.ajax({
            type: "GET",
            url: "http://wwww.example.com/somepage/",
            dataType: "json",
            beforeSend: function(jqXHR){
                _obj.xhrPool.push(jqXHR);
            },
            success: function(response){
                //do something here on successful call
            },
            complete: function(jqXHR){
                var i = _obj.xhrPool.indexOf(jqXHR);
                if(i > -1) _obj.xhrPool.splice(i,1);
            },
            error: function(request, status, error){
                //do something else here on ajax error
            }
        });

    });
}

MyApp.prototype.AbortAllAjaxCall = function(){
    if(this.xhrPool.length > 0){
        var xhrPoolLength = this.xhrPool.length;

        for(x in this.xhrPool){
            this.xhrPool[x].abort();
            this.xhrPool.splice(x,1);
            console.warn("Aborted " x " ajax calls");
        }

        alert(this.xhrPool.length  " of " xhrPoolLength " calls aborted");
    }
}

var app = new MyApp();

Всегда есть 40 звонков одновременно. Я ограничил вызовы ajax, чтобы ни один из вызовов не отвечал на что-либо в течение нескольких минут. т. е. статус всех 40 вызовов остается ожидающим в течение нескольких минут.

У меня есть кнопка, при нажатии на которую звонит app.AbortAllAjaxCall() . app.AbortAllAjaxCall() метод прерывает вызовы ajax в цикле и, наконец, предупреждает о том, что длина прерванных вызовов равна общей длине вызовов ajax.

Проблема

Однако проблема в том, что при нажатии на кнопку все вызовы ajax должны были быть прерваны, но этого не происходит. Мне нужно нажать кнопку buton 3-4 раза, чтобы прервать все вызовы ajax.

Может ли кто-нибудь пролить свет на то, что я здесь делаю не так?

Спасибо

Ответ №1:

Это потому, что вы использовали сращивание, поэтому индекс изменился во время цикла. Например: когда x равно 0, вы прерываете первый ajax и удаляете его из массива, чтобы элемент с индексом 1 стал первым и не был прерван, когда x станет 1. Чтобы решить эту проблему, вы можете выполнить цикл с конца массива:

 for (let x = this.xhrPool.length - 1; x >= 0; x--){
  this.xhrPool[x].abort();
  this.xhrPool.splice(x,1);
  console.warn("Aborted " x " ajax calls");
}

Или просто установите xhrPool значение в пустой массив после прерывания всех ajax без использования splice:

 for(x in this.xhrPool){
  this.xhrPool[x].abort();
  console.warn("Aborted " x " ajax calls");
}
this.xhrPool = [];
Метки: ,