AngularFire2-Firebase存储getDownloadURL（）-如何返回Firestore的URL

Question

我一直在浏览angularfire2文档，以从存储中检索downloadURl。我希望这里缺少一些简单的东西。

该文档指出：

@Component({
  selector: 'app-root',
  template: `<img [src]="profileUrl | async" />`
})
 export class AppComponent {
   profileUrl: Observable<string | null>;
   constructor(private storage: AngularFireStorage) {
   const ref = this.storage.ref('users/davideast.jpg');
   this.profileUrl = ref.getDownloadURL();
 }
}

但是，一旦我上传了图片，我想以字符串形式返回下载网址以上传到firestore。我需要一个外部服务的下载网址。

我的功能

uploadImage(base64data) {

  const filePath = (`myURL/photo.jpg`);
  const storageRef = firebase.storage().ref();

  var metadata = {
    contentType: 'image',
    cacheControl: "public, max-age=31536000",
  };

  const ref = this.storage.ref(filePath);
  const task = ref.putString(base64data, 'data_url', metadata).then(() => {

    var downloadURL = ref.getDownloadURL();

  })

}

这样可以完美上传图像。不过，我会再喜欢写的下载网址，公司的FireStore。当控制台记录我的“ downloadURL”变量时，我得到以下信息：

PromiseObservable {_isScalar：假的，承诺：Y，调度：未定义}

下载是承诺观察到里面。如何仅将下载URL字符串作为变量？一旦有了，我就可以整理出Firestore更新了。

Answer 1

//observable to store download url
downloadURL: Observable<string>;

task.snapshotChanges().pipe(
    finalize(() => {
        this.downloadURL = fileRef.getDownloadURL();
        this.downloadURL.subscribe(url=>{this.imageUrl = url})
    })
)

参考：https : //github.com/ReactiveX/rxjs/blob/master/doc/observable.md

Answer 2

finalize嵌套订阅是一种反模式，因此您应该使用last+switchMap或concat+来代替订阅defer。

最后 + switchMap

task.snapshotChanges().pipe(
  last(),
  switchMap(() => fileRef.getDownloadURL())
).subscribe(url => console.log('download url:', url))

连续+延迟

concat(
  task.snapshotChanges().pipe(ignoreElements()),
  defer(() => fileRef.getDownloadURL())
).subscribe(url => console.log('download url:', url))

Answer 3

这个答案与 Firebase 5.0 版本无关，他们从上传任务中删除了 downloadURL() 。请参阅文档。

.downloadURL()上传完成后，可观察对象会发出下载 URL 字符串。然后你需要订阅才能获取价值。

uploadImage(base64data) {

  const filePath = (`myURL/photo.jpg`);
  //const storageRef = firebase.storage().ref();

  var metadata = {
    contentType: 'image',
    cacheControl: "public, max-age=31536000",
  };

  const ref = this.storage.ref(filePath);
  const task = ref.putString(base64data, 'data_url', metadata);
  const downloadURL = task.downloadURL();

  downloadURL.subscribe(url=>{
     if(url){
         console.log(url);
         //wirte the url to firestore
     }
  })

}

希望这可以帮助。查看此博客了解更多详细信息