首页 > 解决方案 > Firebase 存储:以与有序文件相同的顺序返回 URL

问题描述


我正在 Firebase 上开发一个网络应用程序,并正在编写一个函数来上传到 Firebase 存储并返回用户上传文件的下载 URL。这些文件有顺序,我的目的是按文件顺序存储 URL。
以下函数返回 URL,但它们不是按预期顺序排列的。我想这与不同的文件大小和上传每个文件和下载链接所需的时间不同有关。
如何确保 URL 以预期的顺序存储在 Promise 中?例如,我只能在前一个文件的 URL 存储在 Promise 中之后才想到调用 storageRef.put 方法,但我是编程新手,不知道如何修复它......请帮忙!

function url_array_get(){
    const promises = [];
    const user=firebase.auth().currentUser;
    const filez=review_photo.files;
    const files=Array.from(filez); //This is an array of files with specific ordering
    files.forEach(function(file) { //The files are uploaded in the intended order
       let storageRef=firebase.storage().ref('data/'+user.uid+'/posts/'+file.name);
         promises.push(
             storageRef.put(file).then(function(snapshot){
                 return snapshot.ref.getDownloadURL()
             })
         )
    })
    return Promise.all(promises); //The returned URLs are not in the intended order
}

标签: javascriptfirebasepromisefirebase-storage

解决方案


您必须利用这样一个事实,即Promise.All()“返回值将按照 Promises 传递的顺序排列,而不管完成顺序如何”。

通过使用Promise.all()两次,您将达到目标。以下应该可以解决问题(未经测试)。

function url_array_get() {

    const filesPromises = [];
    const user = firebase.auth().currentUser;
    const filez = review_photo.files;
    const files = Array.from(filez); //This is an array of files with specific ordering

    const urlsPromises = [];

    files.forEach(function (file) { //The files are uploaded in the intended order
        const storageRef = firebase.storage().ref('data/' + user.uid + '/posts/' + file.name);

        filesPromises.push(
            storageRef.put(file)
        )
    })
    return Promise.all(filesPromises)
        .then(function (uploadTasks) {

            uploadTasks.forEach(function (uploadTask) {
                urlsPromises.push(uploadTask.snapshot.ref.getDownloadURL())
            })

            return Promise.all(urlsPromises)
        })
        .then(function (urls) {

            // urls is the Array of all download URLs in the right order
            urls.forEach(function (url) {
                console.log(url);
            })

        })

}

推荐阅读