Ngrok For Absolute Beginners

What is Ngrok?

Whenever you search about Ngrok you’ll find something like this

“ngrok is a tool to make a localhost live”

Or

“ngrok is a tool used to make our localhost code available remotely”

Or

“ngrok is a tool used to publish our localhost project or service live”

Well, it's more than that.

The simplest and most straightforward use of Ngrok is to make our code (code in our local system or local project) available for a remote person or remote server without deploying it anywhere. This means you don’t need to publish your code anywhere for testing, you can simply give your code access to a remote person for testing with the help of Ngrok.

You can mostly use it for the following types of project

• Web Based projects ( includes MVC and other projects too )
• REST API project. ( to test REST APIs )

Recently I came across a scenario where I had to debug a REST APIs project developed in .NET 3.1 which was actually written by someone else.

Both calls were REST API calls.

We can also use POSTMAN for debugging that code. But there is a problem with that. You can’t replicate the live issue in the postman all the time. As you’ve to prepare request structure with exact payload for the POSTman.

So learned one more thing here “POSTMAN can’t be used to test live issues” we’ve to prepare that case study on our own which is time-consuming. And in some cases in very diverse teams it is hard to the exact payload data in the request structure.

Pros and cons of POSTMan and other tools can be discussed at some other place. Now let’s jump to the installaiton of Ngrok.

Install Ngrok

You can download the latest and stable version of ngrok from their official website at

https://ngrok.com/download

you’ll see something like this here.

Once you click download, an exe file in a zip will be downloaded.

Extract this zip file and you’ll see this exe file only.

Right click on this and run as administrator. Once it is running you’ll see this

After downloading, your first step should be to make an account on ngrok website in order to get an authToken for the local agent.

Once you are done with login you’ll see the auth token on your home page. Just copy the whole command containing your authtoken and paste into the agent.

Now you are ready to use ngrok.

Exposing local server ports with Ngrok

So in order to use Ngrok to make your local code live. You have to do two things

1. Tell the ngrok about your local project (local host)
2. Tell the remote entity about the Ngrok you are using.

Step 1

Type command in ngrok

ngrok http localhosturl

localhost URL: It contains the complete local host URL your project is using. In case of a .NET Core project you see that in launchSetting.json file.

So the final command will be like

ngrok http https://localhost:5001

and press enter.

Press enter.

You can see ngrok is trying to connect to your project to make it live.

Note:

It is unable to connect because our project is not running. So your project must be running on localhost before starting ngrok.

As soon as i run my local project and it’s running on local host as shown below.

You go to ngrok again and type the command    

ngrok http https://localhost:5001

Again but it is better to restart the ngrok agent before running this command.

Forwarding URL is the URL that is live and portrays your project live for the other person or entity to use.

And this will be considered the base URL for testing meaning you have to add controller and action names at the end of URL using slashes.

Step 2

Now step 2 is simple, you just have the provide this forwarding URL to the external entity for testing your local project.

Summary

Here in this article, I have provided the steps to install ngrok and how to give access to local projects that can be given to an external person to test.