Поддерживать порядок запросов при выполнении нескольких обратных вызовов ajax

Question

Я перебираю несколько элементов и делаю ajax-запрос для каждого из них (используя jQuery). Я хочу, чтобы они выполнялись независимо, но заполняем DOM в порядке их вызова, а не в порядке их возврата (по некоторым причинам некоторые запросы занимают больше времени, чем другие). Какие-нибудь советы по лучшей практике для такого рода вещей?

Answer 1

Что ж, результаты могут возвращаться в любом неопределенном порядке, они асинхронны и подвержены капризам интернета и серверов.

То, что вы можете сделать, это решить проблему так же, как это делает TCPUDP.Вы используете идентификаторы последовательности.

Сохраняйте идентификатор последовательности в рабочем состоянии и увеличивайте его каждый раз, когда отправляете запрос.Когда запросы возвращаются, отметьте их по порядку и обрабатывайте только по мере их поступления. Сохраняйте список того, что было возвращено с данными по порядку, и регулярно проверяйте этот список после каждого обновления.Когда ожидается первый ожидаемый, он должен обработать весь список до первого промежутка.

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

Answer 2

Ответом на этот вопрос стал плагин jQuery под названием ajaxManager. Это именно то, что мне нужно:

https://github.com/aFarkas/Ajaxmanager

Answer 3

Вы можете отправить все объекты результата успеха в очередь.Иметь индекс, отправленный с исходным запросом, и постоянно проверять эту очередь на наличие следующего индекса.

Но обычно браузеры допускают только два одновременных ajax-запроса, поэтому может стоить просто отправить следующий ajax-запроспри успешном выполнении предыдущего запроса.

Вот начало кода:

var results = {}, lastProcessedIndex = 0;
var totalLength = $('a.myselector').each(function(el, index){
    $.ajax({
        url: $(this).attr('href'),
        success: function(result){
            results[index] = result; // add to results object
        }
    });
}).length;

var intervalId = setInterval(function(){
    if(results[lastProcessedIndex]){
        // use object
        lastProcessedIndex++;
    }
    else if(totalLength == lastProcessedIndex){
        clearInterval(intervalId); 
    }
}, 1000); // every 1 second

Answer 4

Я получу удар в темноте с этим, но это может помочь.Возможно, вы могли бы создать глобальный буферный массив, а затем всякий раз, когда AJAX возвращает, вы можете добавить результат в буфер.Затем вы можете установить таймер, который при запуске будет проверять содержимое буфера.Если они в порядке, он выведет его соответственно.