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);