Отображение API-схемы Instagram: сохранение возвращенных данных

Question

Я занимаюсь разбиением на страницы с помощью API Instagram; Тем не менее, я немного зациклен на том, как идти о хранении возвращенных данных через мои рекурсивные вызовы.

Я хотел бы сохранить все ссылки на элементы в массиве, но мой текущий метод возвращает пустой массив.

var collected_objs = []; // Array to collect links (urls) 

$(document).ready(function() { 
    $('#fetch_followers').click(function() { 
     pollInstagram('https://api.instagram.com/v1/users/3/media/recent/?callback=?&min_timestamp=1388563200&max_timestamp=1420099200&access_token={access_token}', 33); 
    }); 
}); 

function pollInstagram(next_url, count) { 
$.ajax({ 
    method: "GET", 
    url: next_url, 
    dataType: "jsonp", 
    jsonp: "callback", 
    jsonpCallback: "jsonpcallback", 
    success: function(data) { 

     $.each(data.data, function(i, item) { 
      $("#log").val($("#log").val() + item.id + '\n'); 
      console.log("****************************"); 
      console.log("This " + JSON.stringify(item.link)); 
      console.log("****************************"); 
      $('#target').append('<div id="likes_info"><a href="'+item.link+'"><img src="'+item.images.thumbnail.url+'"/></a>'+"<p><span>"+item.likes.count+"</span></p></div>"); 

      collected_objs.push(item.link); // Adding urls to collected_objs -- Not Working 
     }); 
     $("#log").val($("#log").val() + data.pagination.next_url + '\n'); 

     // If the next url is not null or blank: 
     if(data.pagination.next_url && count <=50) { 
      var n_url=data.pagination.next_url + "&callback=?"; 
      pollInstagram(n_url, ++count); 
     } 
    }, 
    error: function(jqXHR, textStatus, errorThrown) { 
     //alert("Check you internet Connection"); 
     $("#log").val($("#log").val() + 'Error\n'); 
    } 
}); 

} 

Answer 1

Поскольку ваш запрос Ajax на Instagram API выполняется асинхронно, вам нужно будет либо использовать функцию обратного вызова (передается в качестве аргумента) или возвращать $.Deferred. Я также предлагаю искать ресурсы для обработки асинхронного javascript. Сначала может быть трудно окунуться в голову, но есть много учебных пособий.

Ниже непроверенных использование на свой страх и риск :)

обратного маршрута

function pollInstagram(next_url, count, callback) { 
    $.ajax({ 
     // ** snip ** 
     success: function (data) { 
     // ** add data to collected objs ** 

     // pass our transformed data to callback 
     callback(collectedObjs); 
     } 
     // ** snip ** 
    }) 
    } 

    // usage: 
    pollInstaGram('url', count, function (objs) { 
    // this callback is executed _after_ 
    // the ajax request completes 
    // and passed data 
    // do something with objs 
    }); 

отложила маршрут

function pollInstagram(next_url, count) { 
    // we return a jQuery defferred 
    return $.ajax({ 
    // ** snip ** 
    }) 
    .then(function (data) { 
     // add data to collectedObjs 
     return collectedObjs; 
    }) 
    .fail(function() { 
     // handle failure case 
    }) 
    } 

    // usage 
    pollInstaGram('url', count).done(function (objs) { 
    // done is executed after the deferred is resolved 
    // with the transformed values from our `.then` 
    // ** do something with objs ** 
    });