Local Webhook Testing

Before deploying your webhook endpoint to production, it’s recommended to test it locally. Since webhooks require a public URL, we’ll use ngrok to create a secure tunnel to your local development server (such as localhost:3000).

We recommend using ngrok for local webhook testing(free), but you can use any other service that provides a public URL with a secure tunnel.

Setting Up ngrok

Install ngrok

  1. Sign up for a free account at ngrok.com
  2. Download and install ngrok:
# Using npm
npm install ngrok -g
 
# Using Homebrew (macOS)
brew install ngrok

Configure ngrok

  1. Copy your authtoken from the ngrok dashboard
  2. Add it to your ngrok configuration:
ngrok config add-authtoken your-token-here

Start the Tunnel

  1. Start your local development server:
npm run dev
# Or whatever command you use to start your server
  1. In a new terminal window, create a tunnel to your local server:
ngrok http 3000
# Or whatever port your server is running on

You’ll see output similar to:

Session Status                online
Account                       [email protected]
Version                       3.5.0
Region                       United States (us)
Latency                      21ms
Web Interface                http://127.0.0.1:4040
Forwarding                   https://1234-your-url.ngrok-free.app -> http://localhost:3000

Testing Your Webhook

  1. Copy the HTTPS forwarding URL from ngrok (e.g., https://1234-your-url.ngrok-free.app)
  2. In the CyberBlog dashboard, add a new webhook using:
    https://1234-your-url.ngrok-free.app/api/cyberblog      
    # Or whatever route you want to use
  3. Your local server will now receive webhook events through the secure tunnel at the URL you specified (e.g., https://1234-your-url.ngrok-free.app/api/cyberblog)
  4. Create a basic route in your local app at /api/cyberblog that receives POST requests
export default async function handler(req, res) {
  console.log(req.body)
  res.status(200).json({ message: 'Webhook received' })
}
  1. Click on the Test Webhook button to send a test event in the CyberBlog webhook dashboard

The ngrok URL changes each time you restart the tunnel. You should delete this webhook after testing.

Monitoring Requests

ngrok provides a web interface to inspect all requests:

  1. Open http://localhost:4040 in your browser
  2. View request/response details in real-time
  3. Replay requests for debugging

Next Steps

Once you’ve verified your webhook implementation works locally:

  1. Check out how you should verify the webhook for maximum security
  2. Update the webhook URL in your dashboard to your production URL
  3. Remove the ngrok tunnel
  4. Deploy to production
⚠️

Never use ngrok URLs in production. They are for development and testing only.

For more information about ngrok features and configuration, visit the ngrok documentation.