How to Retrieve Image Stored in Firebase to Show It in View Image View

How can i retrieve this image stored in firebase storage?

In short, how can I make a reference to Firebase Storage to fetch the image?

In order to be able to get an image from Firebase Storage, you need to know its path. If you need to get that path directly from the Firebase Console, you should click on an image, and on the right-hand side will see a section named File location. Inside this section, under the Access token, you'll see the actual access token of the image. Simply clicking on the token, will copy the entire download URL in the clipboard. Paste it in your project and that's it.

If you need it programmatically, please check my answer from the following post:

  • How to get the download url from Firebase Storage?

Retrieving image from Firebase Storage

I found the following solution (as suggested in the comments before):

Using the Firebase UI plugin with Gilde, I added the following dependency:

implementation 'com.firebaseui:firebase-ui-storage:6.2.0'

Now, having the StorageReference reference pointing to the image, and the ImageView in which the content must be uploaded, the following code retrieves the image and puts it in the ImageView:

Glide.with(ViewScenesSG.this)  //this is the current Activity
.load(reference)
.into(imageView);

To be mentioned that the ImageView must have the dimensions set to a specific value, not using wrap_content or match_parent (at least for height in my case), otherwise it will appear as a small icon. This can also depend on how the image was saved before in the Storage.

Hope this will help someone else as well!

Can't display image in Image view from firebase

you are using STORAGE LOCATION of Firebase it will not work
You have to use DOWNLOAD URL as per below image with highlighted

see below image

How do I retrieve an image from Firebase Storage and show it? Getting No content provider error

I achieved this as follows:

FirebaseStorage mStorage = FirebaseStorage.getInstance();
final StorageReference mStorageRef = mStorage.getReference();

mStorageRef.child(mBox.getUrl()).getDownloadUrl()
.addOnSuccessListener(new OnSuccessListener<Uri>() {
@Override
public void onSuccess(Uri uri) {
Glide.with(getContext()).load(uri).into(mBoxImage);
}
})
.addOnFailureListener(new OnFailureListener() {
@Override
public void onFailure(@NonNull Exception exception) {
// Handle any errors
}
});

How to View All Images from a firebase storage bucket folder in reactJS

Since you want to execute, in parallel, an undetermined number of calls to the asynchronous getDownloadURL() method , you can use Promise.all() as follows (untested):

storageRef.listAll()
.then((result) => {
const promises = [];
result.items.forEach((imageRef) => {
promises.push(imageRef.getDownloadURL());
});
return Promise.all(promises);
})
.then(urlsArray => {
setAllRandomImages(urlsArray);
});


You can also use map, as follows:

storageRef.listAll()
.then((result) => {
return Promise.all(result.items.map(imageRef => imageRef.getDownloadURL());
})
.then(urlsArray => {
setAllRandomImages(urlsArray);
});

Retrieve image stored in Firebase storage

Access tokens for Firebase Storage download URLs don't expire. If a token becomes invalid, it's because you revoked it (from the Firebase console) - in which case I assume you actually want the user to lose access to that image.

Saving download URLs is the idiomatic way to solve this use-case, where users need public access.


In your second approach you could consider download the data through the SDK, instead of through a download URL. That would lead to a single request per image.


Also see:

  • Firebase Storage getDownloadUrl's token validity
  • Do download URLs of Firebase Storage objects live forever?


Related Topics



Leave a reply



Submit