Firebase store getDownloadURL () does not return a working URL

Question

I tried using the getDownloadURL() method to retrieve the url of my images that are stored in the firebase repository.

It is strange that it returns a url that is an object, not images

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ EXAMPLE URL ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ ↓↓↓↓ ↓↓↓↓↓↓↓↓↓↓↓ https://firebasestorage.googleapis.com/v0/b/example.appspot.com/o/images%2Fcat.png ↑↑↑↑↑↑↑↑↑↑↑ ↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑ Example URL ↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑ ↑↑↑↑↑↑↑↑↑

I did some research on the Internet and found out that the correct URL to display my image should be like this ...

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ EXAMPLE URL ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ ↓↓↓↓ ↓↓↓↓↓↓↓↓↓↓↓ https://firebasestorage.googleapis.com/v0/b/example.appspot.com/o/images%2Fcat.png?alt=media&token=sometoken
↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑ example URL ↑↑↑↑↑↑↑↑↑ ↑↑↑↑↑↑↑↑↑ ↑↑↑↑↑↑↑↑↑↑↑↑

But I don't know how to get the url using getDownloadURL() ...

Here is my code ...

 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); }) } 

Any idea?

Answer 1

So, the correct way to get the image url from Firebase is:

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

Note that you use storage.child() instead of storage.ref()

Answer 2

The return you received in the then() callback does not do what you expect from it. When you call getDownloadUrl() , it returns a promise. If you simply associate this promise with a scope, you can use it in your HTML:

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

Answer 3

this work is for me

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