promise.all 在 firebase 中使用 getDownloadURL()

Question

我正在努力获取 Firebase 存储中的下载图片 URL。

我想用这段代码实现的是一张接一张地上传两张图片，并将图片的 URL 推送到数组中。

但是，我的代码不能作为异步正常工作。 Promise.all() 之后的结果假设返回带有 URL 的数组。 如果有人指导我解决此问题，我将不胜感激。

const handleUpload = () => {
    Promise.all([uploadImage(window1Image), uploadImage(window2Image)])
      .then((result) => {
        console.log(result);
      })
      .catch((err) => {
        console.log(err);
      });
  };

const uploadImage = (image) => {
    const uuid = Date.now() + uuidv4();
    const imageToServer = storage.ref(`images/${uuid}`).put(image);
    imageToServer.on(
      'state_changed',
      (snapshot) => {
        const progress = Math.round((snapshot.bytesTransferred / snapshot.totalBytes) * 100);
      },
      (error) => {
        console.log(error);
      },
      () => {
        storage
          .ref('images')
          .child(uuid)
          .getDownloadURL()
          .then((data) => data);
      },
    );
  };

Answer 1

您应该使用UploadTask 的then() 方法，该方法“行为类似于Promise，并在上传完成时使用其快照数据进行解析”。

以下应该可以工作（未经测试）：

  const handleUpload = () => {
    Promise.all([uploadImage(window1Image), uploadImage(window2Image)])
      .then(result => {
        console.log(result);
      })
      .catch(err => {
        console.log(err);
      });
  };

  const uploadImage = image => {
    const uuid = Date.now() + uuidv4();
    const imageToServer = storage.ref(`images/${uuid}`).put(image);
    return imageToServer.then(uploadTaskSnapshot => {
      return uploadTaskSnapshot.ref.getDownloadURL();
    });
  };