AngularFire上传并获取下载URL [英] AngularFire upload and get download URL

问题描述

我正尝试上传到我的存储桶，然后在上传完成后立即获取该上传文件的downloadURL.此操作以前曾起作用，但由于某种原因已停止.

I'm trying to upload to my Storage bucket and then get the downloadURL to that uploaded file right after the upload is done. This was working previously but has since stopped for some reason.

我的控制台打印仅返回null.我希望有一个解决方案，甚至是更好的方法.任何帮助都会很棒！

My console print is just returning null. I was hoping for a solution or even a better way of doing this. Any help would be awesome!

我正在使用Angular 5.

I'm using Angular 5.

这是我当前的方法:

  upload(event) {
    this.showProgressBar = true;
    const randomId = Math.random().toString(36).substring(2);
    this.ref = this.afStorage.ref(randomId);
    this.uploadTask = this.ref.put(event.target.files[0]);
    this.uploadProgress = this.uploadTask.percentageChanges().subscribe(progress => {
      console.log(progress);
      document.querySelector('#progressBar').style.width = progress + "%";
      if(progress === 100){
        this.showProgressBar = false;
        this.showUploaded = true;
        this.downloadURL = this.uploadTask.downloadURL().subscribe(url => {
          console.log(url);
        });
      }
    });
  }

推荐答案

这是我使用angularfire 2进行文件上传过程编码的方式.

Here is the way that I coded using angularfire 2 for the file uploading process.

public selectedFile: FileList;
chooseFile(event) {
  this.selectedFile =  event.target.files;
}

uploadImage() {
  const file = this.selectedFile.item(0);
  const key = 'uploads/' + '/' + Math.floor(Math.random() * 1000000) + file.name;
  const upload = this.stroge.upload(key, file).then(() => {
    const ref = this.stroge.ref(key);
    const downloadURL = ref.getDownloadURL().subscribe(url => {
      this.Updateprofile(url);
    });   
  });
}

这篇关于AngularFire上传并获取下载URL的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！