等待angularfire存储上传

时间:2020-08-16 17:05:19

标签: javascript angular firebase-storage angularfire2

我正在做我应用程序的“完成您的个人资料”部分,我想将一些图像上传到Firebase。

全部通过位于我的“ auth”服务中的2种方法完成。我在从上传文件中获取数据时遇到问题,这是到目前为止的代码:

async updateUserProfile(
    profilePicture: File,
    name: string,
    birthdate: Date,
    countryCode: string,
    photoID: File
  ) {
    let updatedAppUser: authenticatedUser;

    this.appUser.pipe(take(1)).subscribe((currentAppUser) => {
      updatedAppUser = currentAppUser;
    });

    const uploadPackage = new FormData();
    uploadPackage.append(updatedAppUser.UID, profilePicture);
    uploadPackage.append(updatedAppUser.UID + "_", photoID);

    let uploadedData = await this.fileUpload(uploadPackage);
    let profilePicturePath: string;
    let photoIDPath: string;

    //**********************************************
    //HERE IS THE PROBLEM-- I THINK THIS IS WRONG
    //**********************************************
    if (uploadedData) {
      profilePicturePath = uploadedData[0];
      photoIDPath = uploadedData[1];
    }

    //TO-DO: call backend and update the user profile

    //after success from backend call
    //console.log("photoID Path: ", photoIDPath);
    updatedAppUser.showKYC = false;
    updatedAppUser.userProfilePicture = profilePicturePath;
    updatedAppUser.isPendingValidation = true;
    updatedAppUser.userName = name;
    updatedAppUser.userBirthdate = birthdate;
    updatedAppUser.userCountryCode = countryCode;

    //save to local storage
    this.storeAuthData(updatedAppUser);

    //new updated appuser
    this.appUser.next(updatedAppUser);
  }

这是我用来将数据上传到Firebase的方法:

private async fileUpload(data: FormData) {
    const filePaths: string[] = [];
    const promises: AngularFireUploadTask[] = [];

    for (const value of data.entries()) {
      const uploadTask = this.firebaseStorage.ref(value[0]).put(value[1]);

      promises.push(uploadTask);
    }

    const promiseArray = await Promise.all(promises);
    if (promiseArray) {
      promiseArray.forEach(async (filePromise) => {
        filePaths.push(await filePromise.ref.getDownloadURL());
      });

      return filePaths;
    }
  }

1 个答案:

答案 0 :(得分:1)

我可能会使用第二个Promise.all来进行下载URL检索,并删除await的用法,因为这会使事情变得混乱:

  private async fileUpload(data: FormData) {
    const promises: AngularFireUploadTask[] = [];

    for (const value of data.entries()) {
      const uploadTask = this.firebaseStorage.ref(value[0]).put(value[1]);

      promises.push(uploadTask);
    }

    Promise.all(promises).then((tasksArray) => {
      const filePaths = tasksArray.map((task) => task.ref.getDownloadURL());

      return Promise.all(filePaths);
    }
  }
相关问题