使用 Promise.map 对文件上传进行排队

Question

第一组文件上传成功，但一旦完成，它就不会启动队列中的下一组文件。

为什么迭代在第一组后停止，如何解决此问题？

该解决方案不一定必须使用Bluebird - 我首先使用它，因为我认为，我会变得更容易。

function uploadFile(url, file, onProgress) {
    return new Promise((resolve, reject) => {
        const formData = new FormData();
        formData.append('file', file);
        const xhr = new XMLHttpRequest();
        xhr.open('POST', url);
        xhr.addEventListener('readyState', _ => {
            if (xhr.readyState === xhr.DONE) {
                resolve(file);
            }
        });
        xhr.addEventListener('error', _ => {
            reject(new Error());
        });
        xhr.upload.addEventListener('progress', event => {
            onProgress && onProgress(event.loaded / event.total);
        });
        xhr.send(formData);
    });
}
/* files is a FileList */
Promise.map(Array.from(files), file => {
    return uploadFile(location.href, file, null);
}, { concurrency: 2 });

Answer 1

事件类型称为 readystatechange(不是 readyState (。

正如powerc9000在评论中注意到的那样，Promise没有得到解决，Promise.map不知道何时继续。