同步检索firebase存储url？答案

【问题标题】：Retrieving firebase storage url synchronously?同步检索firebase存储url？
【发布时间】：2018-02-19 00:47:36
【问题描述】：

我有一个对象列表，其中包含如下文件名列表：

Object 1
    Files
     file1:1234
     file2:2345
Object 2
     Files
     file1:456
     file2:656

我正在迭代每个对象，并且在每个对象内部我正在迭代每个文件并查询 firebase 存储以获取每个文件的 url，以便将其作为超链接显示到数据表中。

var tableData = [];
//Code to Loop over the objects
  var myApp ={ fileurls:[]};
  var i =0;
  angular.forEach(filesContainer.filenames, function(value, key) {
            storageRef.child('/myfiles/'+ value)
            .getDownloadURL().then(function(url) {
                myApp.fileurls[i] = url;
                i++;
                }
            }).catch(function(error) {
                console.log("Error");
                });
  });
tableData.push();
//Loop over object ends here
//invoke successcallbackfunction to display the tableData
successcallbackfunction(tableData);

我上面的代码的问题是由于异步的firebase调用，myApp数组总是空的。我怎样才能确保tableData.push() 行仅在循环对象文件完成时才被执行？

【问题讨论】：

一件事，你需要通过改变 var myApp ={ fileurls[]}; 来更新你的 JavaScript 代码吗？到 var myApp = { fileurls: [] }; ?
粘贴代码时打错了

标签： javascript firebase asynchronous firebase-storage

【解决方案1】：

尝试改变这个：

angular.forEach(filesContainer.filenames, function(value, key) {
            storageRef.child('/myfiles/'+ value)
            .getDownloadURL().then(function(url) {
                myApp.fileurls[i] = url;
                i++;
                }
            }).catch(function(error) {
                console.log("Error");
                });

到：

angular.forEach(filesContainer.filenames, function(value, key) {
            storageRef.child('/myfiles/'+ value)
            .getDownloadURL().then(function(url) {
                myApp.fileurls[i] = url;
                i++;
                  if (i == filesContainer.filenames.length) {
                       tableData.push();
                       //Loop over object ends here
                       //invoke successcallbackfunction to display the tableData
                       successcallbackfunction(tableData);
                  }

                }
            }).catch(function(error) {
                console.log("Error");
                });

所以一旦最后一次迭代完成，然后执行你想要的代码。

【讨论】：

逻辑不正确，我需要在对象循环结束而不是文件循环后进行成功回调。我的对象循环本质上是一个 forEach on firebase 查询快照

【解决方案2】：

Reference.getDownloadUrl() function returns a Promise。这意味着您可以使用Promise.all() 进行通常的承诺收集：

var tableData = [];
var i =0;
var promises = [];

angular.forEach(filesContainer.filenames, function(value, key) {
    promises.push(
        storageRef.child('/myfiles/'+ value).getDownloadURL()
    });
});
Promise.all(promises).then(functions(urls) {
    var myApp ={ fileurls: urls };
    tableData.push();
    successcallbackfunction(tableData);
}).catch(function(error) {
    console.log("Error");
});

【讨论】：