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