How to share a link to a firebase development environment when using firebase emulators?

Question

In my development local environment, I'm using Firebase emulators for Hosting , Firestore and Functions .

I'm used to share a link with other people during development by using ngrok . I also use it to test on mobile devices during development.

This is the script:

"share": "ngrok http 80 -host-header=\"dev.myproject.com:80\"",

It works fine as far as redirecting to my dev domain host, which is dev.myproject.com .

But the emulators services become unavailable when you are accessing this link through a different device, ie: a different PC or a mobile device.

Obviously, the firebase package is looking for those localhost emulators, which are only running in my local environment.

What is the workaround in this case? How to share a dev environment with other people / other devices when using firebase emulators? Is there an easy to do this?

Do I have to create an extra Firebase project to deploy the test version and its data and files? How do people usually handle this?

Answer 1

We are currently trying to do this using ngrok as well.

We are barely testing if it works, and so far it is doing so. So I'll share our work around with you.

What we do is

• Start emulator firebase emulators:start ( --import seedData if using )
• Expose your server to the internet using ngrok by first starting it with ./ngrok http http://localhost:5001 (check your firebase.json in order to see what port your emulators.functions are exposed, in my case was port 5001)
• This will output two URLs , with the following format https://[TWILIOADRESS].ngrok.io
• In order to be able to invoke the implemented https function via its unique URL, append this to the provided ngrok URL: [project-id]/[project-implemented-region]]/[cloud-function-name]
• You will end up with an URL that looks like this:

https://92003e41ecb0.ngrok.io/my-project-id/us-central1/cloudFunctionToExecute

• Now you can make a request (from postman, in my case) to the exposed function emulator using this URL
• If everything went alright, you should see some logs on the terminal where the emulators are running that tell you the function was executed, such as:

 functions: Beginning execution of "us-central1-cloudFunctionToExecute

• You can also check status and metrics information about connections made over your tunnel from the UI terminal provided when you start ngrok. ngrok provides a real-time web UI where you can introspect all of the HTTP traffic running over your tunnels. After you've started ngrok, just open http://localhost:4040 in a web browser to inspect request details