Firebase存储getDownloadURL()不会返回工作网址

时间:2016-11-01 16:26:56

标签: javascript angularjs firebase firebase-storage

我尝试使用getDownloadURL()方法检索存储在firebase存储中的图片的网址。

奇怪的是它返回一个对象的url,而不是图像

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓例子网址↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ https://firebasestorage.googleapis.com/v0/b/example.appspot.com/o/images%2Fcat.png 联想网址↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑ ↑↑↑↑↑↑↑↑↑↑↑↑

我在网上进行了一些研究,发现显示我的图像的正确网址应该是这样的......

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓例子网址↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ https://firebasestorage.googleapis.com/v0/b/example.appspot.com/o/images%2Fcat.png?alt=media&token=sometoken
联想网址↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑ ↑↑↑↑↑↑↑↑↑↑↑↑

但我不知道如何使用getDownloadURL() ...

获取网址

这是我的代码......

var storage = firebase.storage();

$scope.getImgUrl = function(file) {
    storage.ref("images/" + file + ".png")
      .getDownloadURL()
      .then(function onSuccess(url) {
        return url;
      })
      .catch(function onError(err) {
        console.log("Error occured..." + err);
      })
  }

有什么想法吗?

5 个答案:

答案 0 :(得分:4)

因此,从Firebase获取图片网址的正确方法是:

 $scope.getImgUrl = function(file) {
        storage.child("images/" + file +".png").getDownloadURL().then(function(url) {
          return url;
        }).catch(function(error) {
          // Handle any errors here
        });
 }

请注意,您使用的是storage.child()而非storage.ref()

答案 1 :(得分:3)

then()回调中的回复不符合您的预期。当你致电getDownloadUrl()时,它会返回一个承诺。如果您只是将该承诺绑定到范围,则可以在HTML中使用它:

$scope.getImgUrl = function(file) {
    return storage.ref("images/" + file + ".png").getDownloadURL();
}

答案 2 :(得分:0)

这对我有用

firebase.storage().ref().child('Audios/file.wav').getDownloadURL().then(function(downloadURL) {
                        console.log('File available at', downloadURL);
 });

答案 3 :(得分:0)

几年后的2020年,我也遇到了同样的问题 事实证明……从此进行测试时,我只需要将Firebase安全性配置为公开

// Only authenticated users can read or write to the bucket
service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read, write: if request.auth != null;
    }
  }
}

为此,在firebase规则标签中

// Only authenticated users can read or write to the bucket
service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read, write: if true;
    }
  }
}

答案 4 :(得分:0)

下面的代码对我有用。它适用于视频文件和图像。

var ref = firebase.storage().ref().child('child');
var file = document.querySelector("#htmlInputTagID").files[0];
var task = ref.child(('file name').toString()).put(file);
var imgURL = "";
task.then(snapshot => {
    snapshot.ref.getDownloadURL().then(url => {
        imgURL = url;//this is the URL I use and it works 
        //for me it can be done also for video files
    });
});