Как гарантировать порядок нескольких ajax результатов? - PullRequest
0 голосов
/ 30 апреля 2020

У меня есть запрос ajex с ".done ()" и я его вызываю несколько раз, и хочу убедиться, что процесс в done () обработан по порядку. Не уверен, сколько времени займет процесс в done (). Это может быть 0,1 se c или 0,5 se c.

Простой пример: допустим, у меня есть кнопка reuqest и я нажимаю ее 5 раз. Он отправит 1-5 номер на сервер, чтобы затем повторить его. В done () есть sleep () для имитации задержки. Есть ли способ отобразить 1-5 по порядку в результате?

<button id="test">Request</button>

var counter = 0;
$(function(){
    $('#test').on('click',function(){
        counter++;
        $.ajax({
            url: 'echo.php', // Simply echo back argument (counter value)
            type: 'POST',
            data: {"counter":counter}
        }).done(function(data){
            // Simulate delay
            let waitsec = Math.floor(Math.random()*(3-1)+1);
            sleep(waitsec, function() {
                console.log(data); // show 1-5
            });
        });
    });
});

function sleep(waitSec, callback) {
  var spanedSec = 0;
  var waitFunc = function () {
      spanedSec++;
      if (spanedSec >= waitSec) {
          if (callback) callback();
          return;
      }
      clearTimeout(id);
      id = setTimeout(waitFunc, 1000);
  };
  var id = setTimeout(waitFunc, 1000);
}

Отредактировано: Основано на рекомендациях Афонсу. Я изменил код. Теперь он сохраняет параметры запроса в массиве и запускается один за другим после выполнения. Это все еще не работает должным образом. Что не так с моим кодом?

var counter = 0;
var jqxhr;
var jqxhr_requests = [];
$(function(){
    $('#test').on('click',function(){
        counter++;
        console.log("c: "+counter)
        let request = {
            url: 'echo.php', // Simply echo back argument (counter value)
            type: 'POST',
            data: {"counter":counter},
        };

        if(jqxhr_requests.length <= 0) // Run first request
        {
            jqxhr_requests.push(request);
            jqxhr = $.ajax(jqxhr_requests[0]);
        }
        else
        {
            jqxhr_requests.push(request);
        }

        jqxhr.done(function(data) {
            // Simulate delay
            let waitsec = Math.floor(Math.random()*(3-1)+1);
            sleep(waitsec, function() {
                console.log(data);
            });
            jqxhr_requests.shift();
            jqxhr = $.ajax(jqxhr_requests[0]);
        });
    });
});

1 Ответ

0 голосов
/ 30 апреля 2020

Вы можете проверить, был ли запрос уже выполнен, прежде чем снова выполнить запрос ajax. Если он все еще ожидает ответа, вы можете сохранить в массиве данные, которые вы хотите отправить на сервер, и, когда .done () будет вызван, проверить данные в массиве, а затем выполнить запрос ajax с эти данные.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...