'Tunnel a localhost subdirectory through ngrok?

Objective: want to share a website preview using ngrok, which creates a tunnel from which my localhost can be seen with an url of something like mywebsite.ngrok.io

Problem: I use WAMP and my localhost folder looks something like this:

localhostdirectory
   |-- website1
   |-- website2
   |-- etc

To access a website I type to localhost/website1/ in the browser, I would like to tunnel only that URL, the possible solutions would be:

  1. Setting up a Virtual host, I would go through the hassle of manually setting up a virtual host, then I get something like website1.dev, and then I would pass it to ngrok as the host header in the HTTP request, like that:

    ngrok http -host-header=website1.dev 80
    

    I didn't understand what the host header is though, and why can't I pass a relative url like localhost/website1/, also what is the rewrite option?

  2. Change the folder directory of my localhost to the folder of the website, I would prefer not to do that.

Is there a better way to accomplish my objective in an easier way, maybe going through WAMP aliases?



Solution 1:[1]

If you make do with Apache Vhost you just have to exec command

ngrok http -host-header=rewrite YOUR-LOCAL-DOMAIN:PORT

Dont forgot to edit host file for resolution @IP <-> YOUR-LOCAL-DOMAIN

Solution 2:[2]

I tried below way.

When I ran $ ./ngrok http 80 ngrok listen to localhost:80 which shows dashboard because apache server is running on port 80. Then I tried running subfolder in another port, which solved problem. Assume you have project in xyz and want ngrok should points it. Then do following

$ cd /opt/lampp/htdocs/xyz
$ php -S localhost:8080

Here 8080 is any unused port. localhost:8080 direct points to xyz and then open other terminal

$ ./ngrok http 8080

By doing this ngrok will listen to 8080 port were your xyz is running.

Hope this helps!!

Solution 3:[3]

After you set up the ngrok address to point to localhost on port 80, you can access your websites by their names. Ex:

ngrok http -subdomain=dev 80

Access website1:

dev.ngrok.io/website1

Solution 4:[4]

I believe the correct syntax now for ngrok v3 is ngrok http --host-header=rewrite YOUR-LOCAL-DOMAIN:PORT

Notice the double --

https://ngrok.com/docs/guides/upgrade-v2-v3

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Abdourahmane FALL
Solution 2
Solution 3 semaca
Solution 4