Ngrok

By official documentation, in simple terms below is what best describes ngrok

ngrok allows you to expose a web server running on your local machine to the internet. Just tell ngrok what port your web server is listening on.

Though it has more useful features than plain simple exposure of localhost over the Internet which makes it a complete tunneling solution.

Usage

Ngrok provides Public URLs for

• Testing on mobile devices.
• SSH access to your Rasberry Pi.
• Exposing your local server.
• Testing your chatbot
• Building webhook integrations.
• Demo without deploying and lots more ...

Ngrok - How it works

Pre-requisites

• ngrok (Installation for windows covered below)
• Any running web server. (We will expose a simple NodeJS HTTP Server for demo purposes)

Simple HTTP Server via NodeJS (Optional)

We will create a simple HTTP Endpoint on the root to serve a simple JSON response. Just create server.js with the below contents:

const http = require("http");
const port = process.env.PORT | 8000;

const requestListener = function (req, res) {
    res.setHeader("Content-Type", "application/json");
    res.writeHead(200);
    res.end(`{"message": "Welcome to Ngrok tunnel example."}`);
};

const server = http.createServer(requestListener);
server.listen(port, () => {
    console.log(`Server is running on port ${port}`);
});

And trigger command to serve HTTP Server: node server.js and visit localhost:8000 to see if the server is able to serve requests.

Ngrok Installation - Windows

In this blog, we will be covering how to install ngrok on windows for use. Rest OS should have the same steps apart from OS semantics changing a bit. We need to have an account on ngrok to start tunnels locally which is updated with auth token created on sign up.

1. Sign up on ngrok.
2. On account creation, you will be redirected to the dashboard which how to install the ngrok application archive on different OS along with auth token associated with your account. Snapshot as below:
3. Download the required archive as per your OS, we have download one for Windows.
4. In the case of windows, there is ngrok.exe file as part of the extracted archive. Execute the below command to update auth token to local ngrok.yml to set up tunnels locally.
   ngrok.exe authtoken <auth-token-from-dashboard-from-step-2-snapshot>
   If no issues specifically with permission, the configuration should be updated with auth token.

ngrok - Locally hosted Web Server

1. Now with HTTP Server locally accessible and ngrok installation done, we can start tunnel so our web server running locally can be accessible over public network i.e. Internet and accessible from anywhere without need to deploy or host via Cloud providers, etc.
2. . Make sure your local server is accessible on the specified port, in our case, it is 8000. Execute the below command to start the tunnel:
   ngrok.exe http 8000
3. Once the tunnel is started, it will dynamically (as we are using Free plan of ngrok) generate domain to be accessed over the Internet.

Now we can share URL in forwarding request to the public who want to consume for testing or debugging purpose. When we hit URL exposed by ngrok it forwards requests to an underlying locally hosted web server.

There are many more features you can do with ngrok with their Free as well as Paid plan. For every tunnel restart, the domain will change. If you want reserved domains, you can upgrade the plan apart from other useful features like IP whitelisting, etc. We can also view tunnel details in the ngrok dashboard online via Dashboard --> Endpoints --> Status

Useful Resources

• ngrok official website
• ngrok documentation

Thank you for reading, If you have reached it so far, please like the article, It will encourage me to write more such articles. Do share your valuable suggestions, I appreciate your honest feedback and suggestions!

I would love to connect with you at Twitter | LinkedIn.