What is a Webhook? | Blog

Integration and API news for developers

26th June 2019

There are several fundamental ways to send data from one system to another. Traditionally, integrations between APIs would be the first port of call. However, this one of the most widely used alternative methods is through using Webhooks.

Webhooks Explained

webhooks

Notifications can be generated in an application through firing a webhook when an action or event has been triggered. These notifications are sent to a webhook receivable URL, including a range of data set by the sending application.

Webhook data can be extremely simple, checking that an action has been run, or POSTing data in JSON, XML or form data formats to be unpackaged and made use of by the receiving application.

This method of sending data is an event-driven push action, whereas typical APIs will request data via a GET request on a user’s request or timed interval. 

Webhook Example

If you were looking to get a notification of a website form submission in another application you could achieve this through implementing a Webhook.

In this case, a preset Webhook URL would be added to the form to send the data to the receiving application. 

The Webhook would be created to include all of the fields in the form, encapsulating them in JSON/XML format with the users’ responses when the send button is clicked. This would also be the trigger to send the data to the Webhook URL.

An example of a received Webhook packet would look like this:

{
     "g-recaptcha-response": "03AOLTBLWaU5rHGKgiUzp7kBI-3a8zxG1RnkTqrz61Q3bRCX4MToMEaFhXBvsqnPNpMcEWFlBIF2R6GuqhsWcBEUMEVD_IYpimtnzL8DbM1uLbPbejVxY6OsJopZTiS6Yka-14z37x-MgRy4fcHn0SuAL5gAc-zzD00LuPW3E6WY_l9Ftwo_ORiF5_QsUBGwebM9V_Ts6yz9QVoTI7D7cNhAM1xE9Y7uQ3h_y26VeQXnfofHfYrmBHfhmgkwPPfffNOxo6fe_RYVF0kdPGsZdQTCS0tYVeNdBcE-scWPLTL6GFJLfJo8y7wuOU7SjzVHz9Nra8JhKt3gY",
    "your-name": "Bill Gates",
    "your-email": "bill@microsoft.com",
    "your-subject": "I’d like to find out more",
    "your-message": "Hi there, I’d like to learn more about your product. Can we please arrange a time to talk. Thanks, Bill",
    "url": "https://webhook.cyclr.com/wBhVwe6c",
    "acceptance-519": "1"
}

The receiving application would take this data and map it to the relevant fields in their platform.

Webhook Powered Integrations

Event-driven integrations using Webhooks typically use the POST function to trigger the integration workflow, supplying the initial data to run the integration. 

This method is used to create “real-time” integrations, however while the time to trigger the webhook is near instantaneous, any latency in the sending and receiving applications will inevitably add to the delivery time.

The integration will have to be set up so that the receiving application already knows what fields it is receiving, so that it can properly make use of the incoming data.

Setting up the integration can vary between applications. In some cases, users will have to manually add the Webhook URL they are sending the data into a management screen in the sending application. However, many applications include the ability to POST webhooks directly to their backend through their API. 

Using Webhooks in Cyclr

When creating an integration in Cyclr you would begin your workflow with a webhook step, to:

  1. Trigger the workflow when the Webhook URL is triggered in Cyclr
  2. To supply the initial data to use in the integration and map into other applications

You would then build out the workflow like you would a polling-based integration, using the initial data to either directly map into another application, or use it to trigger other steps and processes in your workflow.

Take a look at the video above to see how you can use the Cyclr Generic Webhook to connect to third-party SaaS applications.

How to create a webhook url

While many of the connectors in Cyclr contain Webhook steps (signified by a black bar), you can also use our Generic Webhook connector. This connector has multiple uses; the most common use is for receiving data (providing you with a Webhook URL to place in your triggering application as well as the ability to auto-discover the fields being sent), but you also have steps available to POST data.

Webhook Steps in Cyclr are signified by the black line on the step’s left border

How to POST data using Webhooks

POSTing data using the Generic Webhook allows you to define a Webhook URL to any external system and build out which fields you want to include in the data packet. You can use this to include any of the data within the workflow, allowing you to combine data from multiple sources. 

Webhook to webhook
An Example of an integration workflow using two types of Webhooks

If you’d like to find out more about what you can do with webhooks in Cyclr get in touch and a member of the team will be ready to show you the ropes.

Found this content useful? Then why not share it!