Display images from firebase storage in html img tags

crispy2k12

I'm attempting to display an image from firebase into html img tags, but it fails to retrieve the image.

Javascript code:

var storageRef = firebase.storage().ref();
var spaceRef = storageRef.child('images/photo_1.png');
var path = spaceRef.fullPath;
var gsReference = storage.refFromURL('gs://test.appspot.com')

storageRef.child('images/photo_1.png').getDownloadURL().then(function(url) {
  var test = url;
}).catch(function(error) {

});

html code:

<img src="test" height="125" width="50"/>
Mosh Feu

Once you have the test variable, you need to set the image's src to it using a script.

Something like this:

//var storage    = firebase.storage();
//var storageRef = storage.ref();
//var spaceRef = storageRef.child('images/photo_1.png');
//
//storageRef.child('images/photo_1.png').getDownloadURL().then(function(url) {
//
//
//  var test = url;
//  add this line here:
//  document.querySelector('img').src = test;
//
//}).catch(function(error) {
//
//});
//
var test = 'firebase_url';

document.querySelector('img').src = test;
<img height="125" width="50"/>

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

Proper Way to display images from Firebase Storage

From Dev

Downloads images from firebase storage

From Dev

How do I display all of the images from my Firebase Storage in React Native without needing image names?

From Dev

Unable to show images from Firebase Storage

From Dev

retrieving images from firebase storage to show in a component

From Dev

retrieving images from firebase storage to show in a component

From Dev

Unable to show images from Firebase Storage

From Dev

Retrieving images from Firebase Cloud Storage

From Dev

populating array with images from a Firebase storage folder

From Dev

Referencing images stored in object storage containers (Wirecloud) from img tag

From Dev

Display images through html img tag with angularjs and ionic

From Dev

Display images of Firebase Storage with a Firestore query to get image url in Flutter

From Dev

Loading images with loop to <img> tags

From Dev

PHP Display all images from DB in a img tagg - PDO

From Dev

Firebase getDownloadURL From Storage Unable To Set Img Src

From Dev

Firebase Storage retrieval images

From Dev

How to show images in firebase storage by index.html

From Dev

Retrieve images from storage with the help of path saved in database and display in listView

From Dev

img src to azure blob storage image not working from html tag

From Dev

Load images using html <img> tag from Android expansion file

From Dev

How to download and view images from the new Firebase Storage?

From Dev

How can I generate html img tags for a folder full of images with AppleScript?

From Dev

Convert all images into clickable A tags with img inside

From Dev

Regex: How to parse images not only the <img> tags

From Dev

strip_tags - Strip <a> tags from a <img>

From Dev

Prevent Display Of Html Tags From User Input Sinatra?

From Dev

Display images in HTML + Nodejs

From Dev

Display images in HTML + Nodejs

From Dev

display images in admin with HTML

Related Related

  1. 1

    Proper Way to display images from Firebase Storage

  2. 2

    Downloads images from firebase storage

  3. 3

    How do I display all of the images from my Firebase Storage in React Native without needing image names?

  4. 4

    Unable to show images from Firebase Storage

  5. 5

    retrieving images from firebase storage to show in a component

  6. 6

    retrieving images from firebase storage to show in a component

  7. 7

    Unable to show images from Firebase Storage

  8. 8

    Retrieving images from Firebase Cloud Storage

  9. 9

    populating array with images from a Firebase storage folder

  10. 10

    Referencing images stored in object storage containers (Wirecloud) from img tag

  11. 11

    Display images through html img tag with angularjs and ionic

  12. 12

    Display images of Firebase Storage with a Firestore query to get image url in Flutter

  13. 13

    Loading images with loop to <img> tags

  14. 14

    PHP Display all images from DB in a img tagg - PDO

  15. 15

    Firebase getDownloadURL From Storage Unable To Set Img Src

  16. 16

    Firebase Storage retrieval images

  17. 17

    How to show images in firebase storage by index.html

  18. 18

    Retrieve images from storage with the help of path saved in database and display in listView

  19. 19

    img src to azure blob storage image not working from html tag

  20. 20

    Load images using html <img> tag from Android expansion file

  21. 21

    How to download and view images from the new Firebase Storage?

  22. 22

    How can I generate html img tags for a folder full of images with AppleScript?

  23. 23

    Convert all images into clickable A tags with img inside

  24. 24

    Regex: How to parse images not only the <img> tags

  25. 25

    strip_tags - Strip <a> tags from a <img>

  26. 26

    Prevent Display Of Html Tags From User Input Sinatra?

  27. 27

    Display images in HTML + Nodejs

  28. 28

    Display images in HTML + Nodejs

  29. 29

    display images in admin with HTML

HotTag

Archive