How to use ngrok - webhook integration
What is Ngrok?
Ngrok allows you to expose your localhost via a secure tunnel to the internet. One of the features of Ngrok is testing the webhook payload in your local environment.
What is a webhook?
Webhook is sending real-time information(as JSON or XML) to a specified URL(External system) whenever some event happens. It's more prevalent these days with the latest platforms such as Shopify, Sanity.io & Mailchimp.
For security reasons, Webhook payloads are only exposed to SSL-certified URLs. This is where Ngrok comes into help.
How does it work?
1 - Install Ngrok in your local machine. For Mac run the below command in your terminal:
brew install ngrok/ngrok/ngrok
2 - I suggest signing up for Ngrok so that account-only features can be used.
ngrok authtoken <token>
3 - Start your Ngrok tunnel.
ngrok http 3000
4 - Copy the secure URL from the terminal and paste it into the webhook URL field from which the payload comes. In my case, I'm testing it with Shopify.
5 - Once the product from Shopify gets updated, it sends the payload to your specified Ngrok URL which tunnels the payload into your local environment.
6 - To inspect your payload, go to "http://127.0.0.1:4040/inspect/http" from your browser.
🎉 JSON payload can be mapped to your local database.