Debugging an API that you are developing can be time consuming, needing to track and adjust some request data/JSON and after that send the request to your localhost service which you are debugging. Things can get even worse when you are working in a team and you need to replicate an issue that was reported by the App developers (web, mobile, raspberry pi etc), where you need to debug multiple API calls to get to a certain state/scenario.
ngrok is a tool that I’ve recently discovered and I can say that has saved me a lot of time and manual execution of requests to my API. This tool is publicly exposing your localhost address (local web server), It connects to the ngrok cloud service which accepts traffic on a public address and relays that traffic through to the ngrok process running on your machine and then on to the local address you specified.
How it works
All you need to do is download ngrok application and can run many commands to tailor everything you need to publicly expose you local web server. After you download the application just run this command.
This instantly create a public HTTPS URL for a web site running locally on your development machine
There a lot of other options which you can set in the free version and you can check them all on the following link -> https://ngrok.com/
Bad Request – Invalid Hostname problem
When I followed the instructions by just executing
ngrok http 80
in order to expose localhost on port 80 I got this error when I tried to open the public address
Other people had this issue as well and the workaround is to use this command instead
ngrok http [port] -host-header="localhost:[port]"
So, very simple to use, minor problems to make it work (like this one I’m mentioning) and you are good to go.
NGrok Web Interface
Another very useful part of the ngrok is the Web Interface. You can find the address in the console info.
There are two main tabs where you can have deeper insights of the calls to your API, this proves to be very useful while testing some (mobile/web) application in development environment and catch all the requests that are made.
In this tab you can see all the requests that are made through the ngrok tunnel, see the response code and the content that they have returned. Also there is an option to replay the request which is very simple just by clicking the “Replay” button.
If you are interested into statistics about your requests you can check those in the “Status Tab”. To be honest, this tab rarely has value for me but it’s sometimes good to have.