是否可以将firebase的图片上传“uploadTask.on”监听器变成一个promise？答案

【问题标题】：Is it possible to turn firebase's image upload "uploadTask.on" listener into a promise?是否可以将firebase的图片上传“uploadTask.on”监听器变成一个promise？
【发布时间】：2018-07-13 05:59:31
【问题描述】：

我正在使用 firebase 并注意到大多数方法都返回了 Promise，但在文档中这不是。是否有可能将其更改为承诺？

uploadTask.on(
    'state_changed',
    function(snapshot) {
        const progress = snapshot.bytesTransferred / snapshot.totalBytes * 100;
        console.log('Upload is ' + progress + '% done');
    },
    function(error) {
        alert(error);
    },
    function() {
        const downloadURL = uploadTask.snapshot.downloadURL;
        console.log(downloadURL);
    }
);

【问题讨论】：

没有。根据定义，Promise 会等待一个将被解析一次的值。 .on 侦听器将触发与数据更新一样多的次数。
@Sidney 看看我的回答。

标签： javascript firebase promise firebase-storage

【解决方案1】：

如果您希望在上传完成后解决某些承诺，请使用以下通用模式：

const promise = new Promise((resolve, reject) => {
    // whenever the work is complete and successful
    resolve()
    // or, whenever the work finishes with an error
    reject()
})

According to the API docs，对于 Cloud Storage for Firebase UploadTask，您的 on 处理程序将收到一个“完成”回调，作为您的第四个参数。所以你可以像这样修改它：

const promise = new Promise((resolve, reject) => {
   uploadTask.on(
    'state_changed',
    function(snapshot) {
      const progress = snapshot.bytesTransferred / snapshot.totalBytes * 100;
      console.log('Upload is ' + progress + '% done');
    },
    function(error) {
      reject(error);  // added this line
      alert(error);
    },
    function() {
      const downloadURL = uploadTask.snapshot.downloadURL;
      console.log(downloadURL);
      resolve();  // added this line
    }
  );
});

您可以看到我在您的代码中添加了对 resolve 和 reject 的调用，现在嵌入在 Promise 内的闭包中。

【讨论】：