Custom local domain network access in dev mode

How to / Third Party Tooling
1

I’m running a local webserver on my machine, and it’s a “copy” of my production url. So let’s say it’s www.example.localhost locally, and www.example.com in prod. (It used to be .dev, but Google ruined that)

The Windows 10 PC it’s running on, and the physical Pixel 3a that’s connected to it via USB, are both on the same wireless network, and subnet.

I’m running an app that tries to make an api call, and it switched based on the dev mode flag. So as soon as I try to make a get request using Axios to www.example.localhost/api/whatever, it instantly fails. (Obviously it works fine at the .com address)

I was able to make it work via an emulator by going through the whole process of editing the system hosts file on the emulator’s image, so it maps 10.0.2.2 (your local computer’s IP address in any google emulator) to www.example.localhost. BUT, I can’t do the same on a real device without rooting, and that’s not an option.

How can I tell the Pixel 3a that requests to www.example.localhost should resolve to my PC?

  • I have opened ports 19000 and 19001 in Windows Firewall
  • I have tried changing the request address in the code from www.example.localhost to the actual machine IP 10.10.4.39
  • I have tried these things with both expo start --localhost and expo start --lan

Since the hosts change on the emulator works, I am assuming I need to somehow tell the physical phone that the .localhost URL should resolve to my PC, but how?

Thanks for any advice.

2

I used to fight with trying to get this to work… not sure if I’ve ever succeeded. Instead, I started using https://ngrok.com to expose the local server over the internet, which has worked well.