使用 javascript 使用 XMLHttpRequest 从服务器下载多个图像

Question

我正在使用 XMLHttpRequest 方法从服务器获取单个图像的 url 以下载、保存然后从 android 本地存储中检索它，并且我已成功使其适用于单个图像 url；现在我一直在想办法使用相同的方法从服务器下载多个图像。任何人都可以告诉我一两个方法吗？

提前致谢！！！

这里是我用来下载单个图像的代码

        var xhr = new XMLHttpRequest();

        xhr.open('GET', url, true);

        xhr.responseType = "blob";
        console.log(xhr);

        xhr.onload = function (e) {
            console.log(e);
            if (xhr.readyState == 4) {
                console.log(xhr.response);
                // if (success) success(xhr.response);
                saveFile(xhr.response, 'images');
            }
        };
        xhr.send();

Answer 1

假设您有可以从中下载图像的 url 列表，您可以使用简单的 for 循环并将 XMLHttpRequest 变量存储在数组中。

var xhrList = [];
var urlList = ['example.com/image1',
               'example.com/image2',
               'example.com/image2'];
for (var i=0; i< urlList.length; i++){
    xhrList[i] = new XMLHttpRequest();

    xhrList[i].open('GET', urlList[i], true);

    xhrList[i].responseType = "blob";
    console.log(xhrList[i]);

    xhrList[i].onload = function (e) {
        console.log(e);
        if (this.readyState == 4) {
            console.log(this.response);
            // if (success) success(this.response);
            saveFile(this.response, 'images');
        }
    };
    xhrList[i].send();
}