Поток управления JQuery Ajax

Question

Я использую JQuery для выполнения вызовов ajax для получения данных. Я делаю несколько вызовов, чтобы получить кусочки этих данных постепенно. Итак, у меня есть что-то вроде:

for(i=0;i<numOfDataObjects;i++) {
  $.ajax({
     //get the data and do something with it in the success callback
  });
}

У меня есть некоторый код после этого цикла, который я хочу выполнить только после , все вызовы ajax завершены и успешные обратные вызовы завершены. Прямо сейчас этого не происходит, я думаю, из-за асинхронного характера объекта xhr.

Есть ли способ, не увеличивая глобальный счетчик в каждой функции успеха ajax (и проверяя, равняется ли он определенному значению), чтобы гарантировать выполнение кода после цикла после завершения всех вызовов сервера?

Answer 1

Существует расширение языка JavaScript под названием StratifiedJS. Он запускается в любом браузере и позволяет обрабатывать асинхронные вызовы подобным образом линейным способом.

Вы можете включить стратифицированный JavaScript, например, включив Oni Apollo (http://onilabs.com/docs) в вашу веб-страницу, например:

<script src="http://code.onilabs.com/latest/oni-apollo.js"></script>
<script type="text/sjs"> your StratifiedJS code here </script>

И ваш код будет выглядеть примерно так:

var http = require("http"); // a module wrapping XHR, part of Apollo
for(i=0;i<numOfDataObjects;i++) {
  //get the data
  var data = http.get(url);
  // and do something with it
}

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

function handleParallelRequests(urls) {
  if (!urls.length) return;
  waitfor {
    var data = require('http').get(urls[0]);
    // and do something with it
  }
  and {
    // in parallel, do remaining requests:
    // continue with the urls without the first we just handled.
    handleParallelRequests(urls.slice(1));
  }
}
handleParallelRequest(myurls);
// all request are finished when you get here.

ключевое слово waitfor / и объяснено на http://stratifiedjs.org/sjsdocs

Answer 2

Вы можете использовать плагин jQuery Message Queuing . Поместите все элементы, которые нужно обработать, в очередь. Обратите внимание на функцию complete в документации:

complete : (Функция) Вызывается, когда больше нет элементов очереди для обработки. После завершения, если будет добавлено больше элементов очереди и очередь завершится снова, эта функция будет вызвана снова. Внутри этой функции this ссылается на объект queueObj.

Поместите код, который вы хотите запустить, в этот обработчик.

Одна оговорка. Я не могу сказать из документации, вызывается ли обработчик complete после выполнения обратных вызовов для каждого запроса AJAX, или же он вызывается немедленно, когда в очереди не осталось элементов для обработки (независимо от того, есть ли выполняющиеся в данный момент запросы AJAX).

UPDATE

Кажется, я проигнорировал функцию callback:

callback : (Функция) Вызывается для каждого элемента очереди или пакета элементов, каждая задержка миллисекунд. Этой функции передается один аргумент, который является единственным элементом очереди, если пакет равен 1, или массивом элементов очереди, если пакет равен> 1. Если обратный вызов возвращает значение true, элемент (ы) очереди будет снова добавлен в перед очередью для следующего выполнения обратного вызова, чтобы повторить. Внутри этой функции this ссылается на объект queueObj.

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