I recently discovered ngrok while developing a Twilio webhook endpoint; I couldn't believe how easy it was to create an instant, secure URL to your localhost server to test / experiment with an application before deploying it. I wrote this article because of that fantastic experience.
This article covers how to use ngrok to easily share a public URL that connects to your local web server (which may be running a website or application that you are developing). This is a great way to test and develop webhook endpoints, or share web applications that are under development, all without having to deploy your code!
This article is broken down into the following steps:
- Installing ngrok
- Creating a secure introspectable tunnel to localhost (i.e. creating a URL to share your local web server)
- Accessing a web application running on localhost
- Using the ngrok dashboard to replay requests
1. Installing Ngrok
Installing ngrok is incredibly simple:
- Create a free ngrok account
- Download ngrok
- Unzip ngrok (Mac users can unzip ngrok by simply double clicking it in their downloads folder)
- Move the unzipped ngrok binary into your path (so you can call ngrok). Command for Mac users:
mv ~/Downloads/ngrok /usr/local/bin
- Your ngrok binary may be in a different location than mine, so you may have to run a slightly different command than listed above
- Connect to your ngrok account by running the ngrok auth command in your terminal found here
- It should look something like
ngrok authtoken abc123...
- It should look something like
After completing the above steps, you are ready to begin creating instant, secure URLs to your localhost server! Time for step 2.
2. Creating a Secure Introspectable Tunnel to Localhost
Now that you've moved the ngrok binary into your path, you can start using it! To create a tunnel to your localhost server on port 3000, you can run the following:
ngrok http 3000
3. Accessing a Web Application Running on Localhost
The previous command you ran,
ngrok http 3000, will output something like this:
ngrok by @inconshreveable (Ctrl+C to quit) Session Status online Account YOUR@EMAIL (Plan: Free) Version YOUR.VERS.ION Region United States (us) Web Interface http://127.0.0.1:4040 Forwarding http://e123fe.ngrok.io -> http://localhost:3000 Forwarding https://e123fe.ngrok.io -> http://localhost:3000
You will be able to access whatever you are running on localhost:3000 through the URL that follows Forwarding above! That means you can share the URL with colleagues in different locations, and they will also be able to access what you are running locally!
4. Using the Ngrok Dashboard to Replay Requests
Using the Web Interface, which by default runs at localhost:4040, you are able to view information for all requests and responses. You are also able to replay previous requests as many times as desired; replaying previous requests is very helpful when debugging or developing webhook endpoints (for services like Twilio)!
And there you have it! Ngrok is easy to install and use, and it's a great way to make what you're running locally temporarily available to the world!
Note: don't forget to be mindful of security when using ngrok