Where to host my image in my ionic 4 app?

Hi guys, so I want to display images in my ionic 4 app.

My code is

<ion-slide>
  <div class="swiper-zoom-container">
    <img src="../assets/img/jadual/1.svg"/>
  </div>
</ion-slide>

So I have thousands of photos to be displayed in my ionic 4 app, and obviously I can’t store them all in my assets folders. Hence, can anyone advise me on the best and easiest way to host my images and just pull the URL into the image src? (avoid using plugins)

I looked into imgbb and imgur, they worked perfectly as all I have to do is store it right there and copy-paste their URL and embed into my img src however I feel unsafe as not sure whether how long their services will be available. I want to use google photos but sharing link does not display the images.

Please advise me. Thanks!

1 Like

One option would to create your own database on your own server. You could place them in a Google Firebase system or maybe AWS. But that will take some effort, but might be the best option long term.

1 Like

Thanks for your reply! I am actually already using firebase services (cloud messaging and database) for my ionic 4 app. Is there any tutorial on how to place them in firebase STORAGE and display them via my app?

https://firebase.google.com/docs/storage/web/download-files

Probably using getDownloadURL method and using the url as image src.

And you need to set the security options properly for non-authenticated users.

https://firebase.google.com/docs/storage/security/start#sample-rules

But the images are placed alongside with <p tags meaning that it’s likes reading notes.

Once user click the button, entering the page, the page will display paragraphs of information and pictures. getDownloadURL method does not allow me to do that as all it does it opening the image only.

Looks to me like it gives you a URL. You can bind <img [src]="urlYouGot"> to your heart’s content.

I checked out the getDownloadURL method, but it’s quite a hassle. I have over thousands of images, do i have to add those methods one by one?

Sorry if that’s a stupid question, I am new dummy.

I’ve often used vercel.com to host static images and similar things. Very easy, and the free plan is quite extensive.

Oh, but do I have to upload my project to github? I don’t want to do that tho.