2017-07-07 42 views
0

使用Firebase處理角4項目。在發佈到Firebase數據庫之前,Firebase存儲下載URL參考

我正在努力解決如何確保在運行下一步之前已經從Observable返回結果。

我知道你不能保證與一個Observable,因爲整點是一個數據流,因此我的困境。

我試圖將圖片上傳到firebase存儲,檢索其下載網址,然後運行對Firebase數據庫的更新。

任何意見,將不勝感激。

註冊用戶服務

$key: string; 
    downloadUrl: string; 
    currentUser: any; 
    loginId: string; 

    constructor(
     private db: AngularFireDatabase, 
     private firebaseUploadService: FirebaseUploadService, 
     private authService: AuthService) { 
     this.firebaseUploadService.currentUrl.subscribe(url => this.downloadUrl = url); 
    } 

registerUser(firebaseRef: string, user: UserModel): Observable<any> { 

     // Create a separate object for file upload with the file passed via the entity 
     const file = Object.assign(<UploadModel>{}, user.imagePath); 
     user.$key = this.authService.currentUserId; 

     return this.firebaseUploadService.pushUpload(user.$key, file).switchMap(upload => { 
      console.log('upload returned from service: ', upload) 
      user.imagePath = this.downloadUrl; 
      return Observable.fromPromise(this.db.object(firebaseRef + '/' + user.$key).update(user)); 
     }); 
    } 

火力地堡上傳服務

currentUser: any; 
    uploads: FirebaseListObservable<UploadModel[]>; 

    private urlSource = new BehaviorSubject('http://saveabandonedbabies.org/wp-content/uploads/2015/08/default.png'); 
    currentUrl = this.urlSource.asObservable(); 

    constructor() { 
    } 

pushUpload(firebaseRef: string, upload: UploadModel): any { 

     const storageRef = firebase.storage().ref(); 
     const uploadTask = storageRef.child(`${firebaseRef}/${upload.file.name}`).put(upload.file); 

     uploadTask.on(firebase.storage.TaskEvent.STATE_CHANGED, 
      (snapshot) => { 
       // upload in progress 
       upload.progress = (snapshot.bytesTransferred/snapshot.totalBytes) * 100 
      }, 
      (error) => { 
       // upload failed 
       console.log(error) 
      }, 
      () => { 
       // upload success 
       upload.url = uploadTask.snapshot.downloadURL 
       this.urlSource.next(upload.url) 
       upload.name = upload.file.name 
      } 
     ); 
     return this.urlSource; 
    } 

回答

0

由於所有火力地堡的調用是異步的,你不能讓下載URL同步。但是你可以使用promise來做一個作弊行爲。

嘗試如下重構代碼:

pushUpload(firebaseRef:字符串,上傳:UploadModel):任何{

const storageRef = firebase.storage().ref(); 
    const uploadTask = storageRef.child(`${firebaseRef}/${upload.file.name}`).put(upload.file); 

    uploadTask.on(firebase.storage.TaskEvent.STATE_CHANGED, 
     (snapshot) => { 
      // upload in progress 
      upload.progress = (snapshot.bytesTransferred/snapshot.totalBytes) * 100 
     }, 
     (error) => { 
      // upload failed 
      console.log(error) 
     }, 
     () => { 
      // upload success 
      upload.url = uploadTask.snapshot.downloadURL 
      this.urlSource.next(upload.url) 
      upload.name = upload.file.name 
      user.imagePath = this.downloadUrl; 
    // Place your http request inside a firebase event 
     return Observable.fromPromise(this.db.object(firebaseRef + '/' + user.$key).update(user)); 
     } 
    ); 
    return this.urlSource; 
} 

這可能會實現

相關問題