0

i'm working locally on my firebase project so i've set up the firebase emulator.

What i'm working working on has many images and videos so i want to connect it to imageKit so that i can play around with it locally. Imagekit can't access it because its on localhost:3000 so i'm using ngrok based on this documentation. Ngrok is able to connect localhost:3000 to a url that people can view. I don't know how to connect Ngrok to my firebase emulator storage configuration so that images and videos from emulator are accessible to imageKit.

These are the emulator ports.

┌────────────────┬────────────────┬─────────────────────────────────┐
│ Emulator       │ Host:Port      │ View in Emulator UI             │
├────────────────┼────────────────┼─────────────────────────────────┤
│ Authentication │ 127.0.0.1:9099 │ http://127.0.0.1:4000/auth      │
├────────────────┼────────────────┼─────────────────────────────────┤
│ Functions      │ 127.0.0.1:5001 │ http://127.0.0.1:4000/functions │
├────────────────┼────────────────┼─────────────────────────────────┤
│ Firestore      │ 127.0.0.1:8080 │ http://127.0.0.1:4000/firestore │
├────────────────┼────────────────┼─────────────────────────────────┤
│ Hosting        │ 127.0.0.1:5000 │ n/a                             │
├────────────────┼────────────────┼─────────────────────────────────┤
│ Storage        │ 127.0.0.1:9199 │ http://127.0.0.1:4000/storage   │
└────────────────┴────────────────┴─────────────────────────────────┘

I have configured ngrok ports for both localhost:3000 and localhost:9199 and i still can't seem to pull image to imageKit.

The image path for local emulator storage is like so:

http://localhost:9199/v0/b/default-bucket/o/images%2F0JvfPkLYsjFsZR0vu4jyqSb83z95%2Fbb095ddb-c556-4262-ae08-a946b5c0dc37-IMG_9715.JPG?alt=media&token=19066972-50dd-4638-9f64-91573e276777

I have changed .json file emulator storage host from localhost to:

 "storage": {
      "host": "0.0.0.0",
      "port": 9199
    },

as i know 0.0.0.0 doesn't have as many restrictions but images are still not accessible externally even though image URL is:

http://0.0.0.0:9199/v0/b/default-bucket/o/profileImage%2FFnFnO7nlW7eA87KrgAytz35X6O8I%2FprofilePhoto?alt=media&token=dc866fff-01be-45ce-a854-b2e98ccb88fe

My question is, am i going about this the right way? Is the only way for me to achieve this, to upgrade on ngrok?

Not a simple question so i'm happy to expand more.

Coolkid
  • 407
  • 1
  • 4
  • 13

0 Answers0