.getJSON in .each function

Question

Я ищу, чтобы вложить функцию .getJSON в функцию .each, чтобы связать данные из двух разных запросов.

Я использую видео api в формате Wistia, и хочу загрузить видео и их базовую информацию, а также показать play_count в разделе «Статистика» JSON.

Вот что я пробовал, но он не работает - какие-либо предложения?

var projectHashId = "3xom8bku3l"; 
var wistiaKey = "*hidden*"; 
var projectStats = "https://api.wistia.com/v1/stats/projects/" + projectHashId +".json?api_password=" + wistiaKey; 
var projectMedias = "https://api.wistia.com/v1/projects/" + projectHashId + ".json?api_password=" + wistiaKey; 

var total = 0 

$.getJSON(projectMedias, function (data) { 
    $.each(data.medias, function (i, v) { 
     var name = v.name; 
     var duration = v.duration; 
     var hashedId = v.hashed_id; 
     var thumb_orig = v.thumbnail.url; 
     var thumb_size = "640x360"; 
     var thumb = thumb_orig.replace('100x60',thumb_size); 
     var description = v.description + "/Created " + v.created; 
     var wistiaKey = "*hidden*"; 
     var mediaStats = "https://api.wistia.com/v1/stats/medias/" + hashedId + ".json?api_password=" + wistiaKey; 

     $.getJSON(mediaStats, function (data) { 
      var loads = data.load_count; 
      var plays = data.play_count; 
      var engagement = data.engagement; 
     }); 

     $('#insert-json-videos').append('<div class="col-lg-12 spacer"><div class="video"><img id="video-thumb" src="' + thumb + '"><div class="video-menu"><div class="video-desc"><div class="video-main">' + name + '</div><div class="video-sub"><span id="video-desc">' + description + '</span></div></div><div class="video-stats"><div class="video-main"><a href="stats"><span id="video-views">' + plays + '</span></a></div><div class="video-sub">total views</div></div></div></div></div>'); 
    }) 
}); 

Answer 1

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

var total = 0 

$.getJSON(projectMedias, function (data) { 
    $.each(data.medias, function (i, v) { 
     var name = v.name; 
     var duration = v.duration; 
     var hashedId = v.hashed_id; 
     var thumb_orig = v.thumbnail.url; 
     var thumb_size = "640x360"; 
     var thumb = thumb_orig.replace('100x60',thumb_size); 
     var description = v.description + "/Created " + v.created; 
     var wistiaKey = "*hidden*"; 
     var mediaStats = "https://api.wistia.com/v1/stats/medias/" + hashedId + ".json?api_password=" + wistiaKey; 

     $.getJSON(mediaStats, function (data) { 
      var loads = data.load_count; 
      var plays = data.play_count; 
      var engagement = data.engagement; 

      $('#insert-json-videos').append('<div class="col-lg-12 spacer"><div class="video"><img id="video-thumb" src="' + thumb + '"><div class="video-menu"><div class="video-desc"><div class="video-main">' + name + '</div><div class="video-sub"><span id="video-desc">' + description + '</span></div></div><div class="video-stats"><div class="video-main"><a href="stats"><span id="video-views">' + plays + '</span></a></div><div class="video-sub">total views</div></div></div></div></div>'); 


     }); 


    }) 
});