Develop a Webhook on local server in 2 steps

Sometimes, our web application needs use the third-party application, such as Google Maps, on live. For example, we want to track our trucks on live.

What we need to do is, first, install a third-party application on the trucks, which can send the trucks Geo-Information to the back-end of our application on live. Then, our back-end transforms these information and present them on the front-end.

This function we build is a Webhook The third-party application keeps sending data to our webhook. Our webhook keeps receiving and transforming data. Attention, these actions are on live.

So, in brief, a webhook consumer is a Controller in back-end using the third-party services on live. “On live” makes this kind of the Controller hard to develop on local server (usually, a server on the local virtual machine). I want to share the way to develop Webhooks Consumer in 2 steps.

Request bin + Postman

This is the first step. We use Request bin to receive a piece of data from the third-party, and use Postman to send it to our back-end.

In this approach, I want to make sure this Controller (webhook) works. So, I use a piece of data instead of data stream, and DO NOT consider “on live”.

Request bin I used is https://requestbin.com/. It gives a free random “website” to simulate our website.

register the endpoint in the third-party application, then the third-application can send data to this endpoint continuously.

I choose a request I want, and copy the data in its body, then send the data to the back-end using Postman. We can see the response in Postman, too. It helps us debug Webhook.

The data from the third-party. copy it and send it to back-end manually

ngrok

Now, I’m sure that the Controller (webhook) works. Now, I need to make sure it works on live. Ngrok helps me to do it. It exposes my local server to public. It simulate “on live” on my local server.

It’s very easy to use. First, create an account in the website of ngrok, and install ngrok on the local virtual machine. I use Vagrant, so I install it in a vagrant box.

Then, if you use Vagrant like me, create a configuration file named ngrok.conf , and write

web_addr: 0.0.0.0:4040

In the end, run the command in virtual machine under the folder that contains ngrok.

./ngrok http 80 -config=</abs/path/to/config/file/>ngrok.conf

You will have 2 endpoints, use the one started with http. Because it’s free :)

register the endpoint, and enjoy developing webhook on your local server.