Public access to virtual host local sites using ngrok

Why the default way to expose the local webserver wasn't working for us

Freshbits Web Solutions's photo
Freshbits Web Solutions
·Mar 14, 2022·

1 min read

Public access to virtual host local sites using ngrok

Photo by Jamie Templeton on Unsplash

Subscribe to my newsletter and never miss my upcoming articles

Backstory

ngrok allows you to let others access your local site. Quite helpful for quick demos and immediate feedback before deployments.

I needed to test the work done by my colleague before merging the PR a few days back. Lazy me didn't want to pull the code and run it locally. I had heard about ngrok but had never used it. It was time to give it a try.

Problem

Its documentation is quite detailed and got us started in 5 minutes. But, the site couldn't be accessed using the provided URL. After some digging, we found out it was because we were using a virtual host in nginx to access the local site.

That means the local site can be opened using something like http://my-awesome-site.local or http://that-brilliant-idea.dev instead of the generic one http://localhost

Solution

Just like a typical developer, I didn't read much of the official documentation. And tried searching for a solution all over the internet. That cost me 40 odd minutes.

There is a section in the docs for rewriting the host header and there is one for virtual hosts too. The change is simple. Instead of:

ngrok http 80

Your command should be something like:

ngrok http --host-header=my-awesome-site.local 80

And it just works. That's it. I hope it helps you.

 
Share this