Extra

Ngrok Made Simple: A Developer’s Guide to Tunneling Your Localhost

ngrok is a service that creates a secure tunnel from the public internet to your local machine. This is particularly useful when you're developing locally (for example, on your local machine) and want to expose your development server to the internet for testing or for receiving webhooks.

For example, if you're running a local Flask app on port 5000 and want to test webhooks from a service like Stripe, ngrok can give you a publicly accessible URL that points to your local machine. This way, the service can send HTTP requests (like webhooks) to your local server.

 

Why Use ngrok?

  • Testing Webhooks: If you're testing webhooks, you need to expose your local server to the internet so services like Stripe or GitHub can send events to your local server. ngrok does this by creating a publicly accessible URL.
  • Remote Access: It’s useful for testing APIs and services that are hosted locally.
  • Easy Setup: ngrok is easy to set up and works across operating systems, including Windows, macOS, and Linux.

How to Install and Use ngrok on Linux

Follow the steps below to install and use ngrok on a Linux machine.

Step 1: Install ngrok on Linux

There are two ways to install ngrok on Linux: using the official package or downloading the binary directly.

Option 1: Install Using the Official ngrok Package

  1. Download ngrok:

    First, download the latest version of ngrok for Linux by running the following commands:

    sudo apt-get update 
    sudo apt-get install unzip curl -s https://ngrok.com/download | tar xz

    This will download the ngrok binary and extract it into the current directory.

  2. Move ngrok to /usr/local/bin (optional):

    You can move the ngrok binary to a directory that’s in your system’s PATH so you can run it globally:

    sudo mv ngrok /usr/local/bin
  3. Verify Installation:

    Check if ngrok was installed successfully by running:

    ngrok --version

    This should return the version of ngrok you installed, confirming that the installation was successful.

Option 2: Install Using a Package Manager (for Ubuntu/Debian)

If you are using Ubuntu or Debian-based systems, you can use Snap to install ngrok.

  1. Install via Snap:

    sudo snap install ngrok
  2. Verify Installation:
    After installation, run the following command to verify:

    ngrok --version

    This should return the installed version of ngrok.

Step 2: Sign Up and Get an Auth Token

  1. Sign Up for ngrok:
    Go to the  https://ngrok.com/ and create an account if you don’t already have one.
  2. Get the Auth Token:
    After signing up, you’ll be able to get your auth token from your ngrok dashboard. The auth token is needed to use some ngrok features like custom subdomains and securing your tunnels.

    Run the following command to authenticate ngrok with your account:

    ngrok authtoken YOUR_AUTH_TOKEN

    Replace YOUR_AUTH_TOKEN with the token you obtained from your ngrok dashboard.

Step 3: Run ngrok

Now you can run ngrok to expose your local server to the internet.

  1. Expose Your Local Server:
    Let’s assume you have a Flask app running on localhost:5000. You can expose this app to the internet using ngrok by running the following command:

    ngrok http 5000
    

    This tells ngrok to create a tunnel for HTTP traffic on port 5000 (the default port for Flask).

  2. Access the Public URL:
    After running the command, ngrok will output something like this:

    ngrok by @inconshreveable                                                                                                                                                                 (Ctrl+C to quit)
    
    Session Status                online
    Account                       Your Account (Plan: Free)
    Version                       2.x.x
    Region                        United States (us)
    Web Interface                 http://127.0.0.1:4040
    Forwarding                    http://abcd1234.ngrok.io -> http://localhost:5000
    Forwarding                    https://abcd1234.ngrok.io -> http://localhost:5000
    

     

    • The line Forwarding shows the public URLs generated by ngrok (http://abcd1234.ngrok.io and https://abcd1234.ngrok.io).
    • These URLs are now accessible over the internet, and any traffic sent to these URLs will be forwarded to your local Flask app running on localhost:5000.
  3. Test the Webhook:
    • Go to the Stripe Dashboard (or whatever service you’re testing) and configure the webhook URL to point to the public ngrok URL (e.g., https://abcd1234.ngrok.io/webhook).
    • When the event is triggered (for example, when a payment is successfully completed), the service will send a POST request to the URL exposed by ngrok, and it will be forwarded to your local Flask app.

Step 4: Monitor the Traffic

ngrok also provides a web interface where you can monitor the requests that are coming through the tunnel.

  • Visit the following URL in your browser:

    http://127.0.0.1:4040 

    This will open the ngrok dashboard where you can see the incoming requests, inspect headers and body, and even replay requests for debugging.

 

Step 5: Stop ngrok

When you're done testing, you can stop the ngrok tunnel by simply pressing Ctrl+C in the terminal where ngrok is running.

 

Benefits of Using ngrok

  1. Remote Access to Local Development: ngrok allows you to expose your local development server to the internet, so you can test APIs, webhooks, and other services that require a public endpoint.
  2. Webhook Testing: It's particularly useful when testing webhooks, as many third-party services like Stripe or GitHub require publicly accessible URLs to send data.
  3. Ease of Setup: It’s simple to use and doesn’t require changing your local development setup or infrastructure.

Conclusion

ngrok is an incredibly powerful tool for developers working on local servers that need to be accessed over the internet, especially when dealing with webhooks, APIs, or remote debugging. Its setup is simple, and it provides easy access to features like custom subdomains and monitoring of requests.

By following the steps above, you’ll be able to expose your local server to the internet and begin testing your webhooks or API integrations.

 

Note: if you are running some front-end application with ngrok url running for backend api , nned to send the below header so the correct response otherwise CORS error or other issues might comes

headers: {
      'ngrok-skip-browser-warning': 1,
    }

 Can setup the ngrok in window from official documentation

https://ngrok.com/downloads/windows


About author

author image

Amrit panta

Fullstack developer, content creator



Scroll to Top