jquery/javascript: как загружать (некоторые) изображения последовательно, а не параллельно?

Question

Проблема уникальна для сайтов с одним знаком на сайтах с перекрестными ссылками. Портал (мой проект) поддерживает базу данных метаданных, описывающих изображения на двух удаленных сайтах. Все 3 требуют аутентификации Shibboleth и используют один и тот же поставщик удостоверений.

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

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

Решение (я думаю) должно иметь небольшое изображение с каждого удаленного сайта на первой странице портала, загружаемой по одному за раз. Как только сеансы установлены, все работает хорошо.

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

Answer 1

var imageNames = ['img1.png', 'img2.png']; 
var counter=0; 

function loadImage(imageName, counter){ 
    $.get(imageName).done(
    function(){ 
     console.log(imageNames[counter] + ' loaded'); 
     counter++; 
     if(counter < imageNames.length){ 
     loadImage(imageNames[counter], counter); 
     } 
    } 
); 
} 

loadImage(imageNames[counter], counter);