Как написать async с $ .getJSON?

Question

я делаю что-то вроде этого

$.getJSON(url1, function(response1){ 
if(response1.status == 'success'){ 
    $.getJSON(url2, function(response2){ 
     if(response2.status == 'success') { 
      $.getJSON(url3, function(response3){ 
       if(response3.status == 'success') { 
        //final code here 
       } 
      }); 
     } 
    }); 
} 
}); 

Я слышал о библиотеке асинхронном как https://github.com/caolan/async#series Как я это реализовать в этом состоянии?

Answer 1

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

$.getJson - это метод полезности, который использует $.ajax для отправки и получения данных с сервера. $ .ajax использует XmlHttpRequest для отправки/получения данных, которые построены с использованием асинхронной модели обработки.

Чтобы проверить природу асинхронности, вы можете добавить console.log (после публикации) после вызова $ .getJson() и console.log ('после обратного вызова') до if (response2.status == 'success').

Если вы проверите консоль после отправки запроса, вы обнаружите, что after post появляется перед after callback, что означает, что выполнение скрипта продолжалось, не дожидаясь ответа с сервера.

Answer 2

Вы действительно хотите сделать синхронный вызов (блокировка браузера до его завершения) или просто «очистить» способ запускать один getJSON после того, как другой будет выполнен (без вложенности в обратный вызов)? Как уже указывали другие, вызовы ajax уже синхронны друг другу.

Для первого варианта ознакомьтесь с более общим $.ajax (вы можете установить async в false в аргументах). Во-вторых, вы можете просто создать рекурсивную функцию полезности:

function chain(list,index,callback,errorCallback) { 
    if (index == list.length) 
     return callback(); 
    $.getJSON(list[index]) 
     .done(function() { 
      chain(list,index+1,callback); 
     }) 
     .fail(errorCallback); 
} 
chain([url1, url2, url3],0,function() { 
    //final code here 
},function() { 
    //error handling here (in any of the calls) 
});