Your Guide To Webhooks

In the Digital Age, it’s increasingly uncommon for an app to be an island. In an era of Big Data, analytics, and omnichannel experiences, nearly everything includes some way to engage with the broader world. Webhooks are one of the common ways for setting this up.

“But isn’t that just an API?” you might be wondering. Close, but not quite. Webhooks perform a very similar function to APIs, but there are some circumstances where the two differ. Typically, webhooks are used for more asynchronous, trigger-based scenarios, whereas RESTful APIs involve the client polling the server for requests.

Let’s delve into webhooks a bit — looking at what they are and the reasons you might want to use a webhook over an API. We’ll finish up with a brief tutorial so you can try out setting up a webhook for yourself.

What Is A Webhook?

The concept behind a webhook is relatively simple. It’s defined as “an event notification sent via HTTP.” This notification is usually sent as a POST request to a specific URL. This data can come in various formats, including XML and JSON, which are then interpreted by the destination URL.

Say, for example, that you want to make an app for alerting you when someone checks in for a reservation at a restaurant, using the Foursquare API. This could be set up as a simple webhook, which sends the customer’s name to a fixed URL.

The data delivered by the webhook — which is known as the payload — doesn’t have to be just a single string, such as a name. Seeing as how payloads are often JSON objects or XML, you could theoretically send however much data you want to the final destination.

A payload doesn’t have to be data, either. A webhook can deliver an executable file, as well. It can even provide a query in the form of ‘form-encoded serialization.’

This further complicates matters, raising the question — what’s the difference between a webhook and an API? The main difference is that an API needs to be queried for data to be delivered while a webhook automatically delivers its payload.

Benefits of Webhooks

As we’ve stated, webhooks and APIs are very similar. The subtle differences make webhooks more appropriate for some applications, though, and an illustration of why you still need them as part of your development stack.

Push Updates

The first and best reason you should use a webhook is if you need to send a notification or update from one app to another. Webhooks are a vital component of sites like ifttt that connect one app or service to another.

For an illustration of why you should use a webhook over an API, consider Twilio. Twilio’s API makes it easy to forward phone calls from one place to another. Forwarding an SMS message is a little trickier, though, without querying the API every couple of seconds.

This is a breeze to set up with a webhook. Twilio designed its service so that the contents of an SMS message can be forwarded to the webhook URL. This is just one of many examples of how webhooks can easily link one app to another or many other real-time event notifications you might need.

Email Integration

Email has become such an ingrained part of daily life that it’s easy to forget it’s actually a fairly complicated system. Without some sort of processing layer, we would all have to set up our own email servers. Webhooks make it so that’s not necessary.

Forwarding emails is as simple as an SMS message with a webhook. Even better, they make it so that you don’t have to deal with a ton of different formats. Everything is handled via HTTP, making your development projects infinitely less complicated.

Automatic Updates

Collaborative and centralized software is everywhere these days. It’s a big part of the appeal of cloud-based software and apps. When something gets changed, the rest of the contributors are notified instantly.

This means that webhooks play a vital role in solutions [like GitHub])(https://www.github.com/). GitHub has webhooks for nearly everything. If you need an alert to be sent once a bit of code finishes running, a webhook is going to be your best bet.

Without a webhook, you’d have to query the API every time you wanted to see if there’d been any changes. That’s simply not practical, plus it defeats the purpose of having automatic updates in the first place.

Monitor Web Changes

By this point, you should be detecting a pattern. Webhooks are helpful for asynchronous scenarios where you don’t want to manually check for updates. Webhooks offer an elegant way to send and receive alerts if something changes on a website.

Webhooks can sync up with services like RSS or PubSubHubbub, which is a protocol built on top of RSS. Webhooks can also be configured to receive an update anytime a static website changes.

Most social media sites offer an RSS feed, as well. This makes it a snap to sync up social media networks to a webhook URL. This can make for a powerful content aggregation solution with minimal effort.

How To Build A Webhook

Now we’ll show you how to build your own webhook so you can try them out for yourself and see how easy they are to set up and work with. For this example, we’ll be using RequestBin and Postman, although you can interact with the webhook directly using the form-encoded query format in the search bar.

In the RequestBin, you’ll see the URL that will receive your webhooks. If you cut-and-paste that address into the web browser, you’ll see a simple JSON object reading {“success”:true} to let you know it’s working.

Now you can interact with the webhook using the form-encoded query format, inserting the objects you want to add following a ?. It might look something like this:

https://enll8bhie10yq.x.pipedream.net/?customer=jimi&value=100.00&item=guitar

Press ‘enter’ to refresh the browser. Now go back to your RequestBin tab, where you’ll be able to see that values have been added for ‘customer’, ‘value’, and ‘item’.

Postman is built to send custom HTML queries, so it’s perfect for getting a feel for what it’s like to send custom data to a webhook URL. To try it out, copy the search query into Postman and set the HTTP type to POST. You’ll then see the variables laid out in Postman’s interface in a clean and easily understandable format.

Even better, you can add as many variables as you like, and Postman will generate a new string of code. This way, you can practice writing form-encoded queries straight from the web browser.

For this example, we’ve added a location object. The revised search query looks like this:

https://enll8bhie10yq.x.pipedream.net/?customer=jimi&value=100.00&item=guitar&location=seattle

That’s it! That’s all it takes to get up and running using webhooks! Now you can experiment with integrating HTTP statuses into your development projects, web apps, or other occasions when you need your digital assets to communicate but don’t necessarily need a full-blown API.