Webhooks

In most cases, Cognito Forms handles everything you need to manage your forms and entries. On the rare occasion when you might need a bit more control, we offer webhooks. Webhooks allow Cognito Forms to communicate with a third-party system (or internally developed application) in order to post new entries as they are submitted.

JSON

JSON, or JavaScript Object Notation, is a common data interchange format that is very popular on the web. It allows different systems (or applications) to communicate data in a fast and efficient manner. The below example illustrates a JSON payload describing a user:

{  
    "id":"12345",  
    "email":"test@test.com",  
    "name":"Test User",  
    "date_created":"2015-01-20T16:42.000Z"  
}

Webhooks

Webhooks are a set of callbacks created within an application which enable that application to send data to a third-party based upon an event. So, for example, you may have a system that you want to be notified whenever a new entry is submitted to your form.

Enabling Web Hooks in Cognito Forms

Post JSON data to a website.

In your form’s Submission Settings, check the box next to Post JSON data to a website?

  • Submit Entry Endpoint: This is the destination URL for the webhook. New entries (i.e. an entry that changes status from Incomplete to Submitted) will be posted as JSON to this endpoint.

  • Update Entry Endpoint: This is the destination URL for the webhook. Updated entries (i.e. an entry that is updated when the status is not Incomplete) will be posted as JSON to this endpoint.

Examples

The following examples illustrate configuring and consuming data from Cognito Forms. They are not necessarily meant to be used in Production, but more as guidance.

Viewing a Post from Cognito Forms

In this example, we’re going to illustrate how one may view data as it is sent from Cognito Forms. In order to do this, we’re going to use a third-party service which allows developers to intercept posts to endpoints.

  1. Navigate to https://webhook.site
  2. Select and copy the automatically generated unique URL (or create a new URL).
  3. Find Post JSON data to a website under Submission Settings in the form builder and paste the URL into the Submit Entry Endpoint option. Save your form.
  4. View your form and submit an entry.
  5. Refresh the page at https://webhook.site You should see the raw form data:

Raw data in Webhook Tester.

Capturing Form Data to a Remote Database

In this example, we will simulate having a remote database in which we will be recording new entries. Most databases communicate data in a language/format known as Sql. Because Cognito Forms communicates data using JSON, we will need an intermediary program to handle this translation.

First, create a small application which can capture data from a Cognito Forms web hook and save that data to a database:

<?php  
    $json = file_get_contents("php://input");  
      
    if (empty($json)) {  
        echo "No data payload";  
        die;  
    }  
      
    $contact = json_decode($json);  
    if ($contact == null && json_last_error() !== JSON_ERROR_NONE) {  
        echo "Error reading JSON: " . json_last_error();  
    }  
  
    $mysqli = new mysqli("localhost", "phptest", "MyP@s$word", "phptest");  
    if ($mysqli->connect_errno) {  
        echo "Failed to connect to MySQL: (" . $mysqli->connect_errno . ") " . $mysqli->connect_error;  
        die;  
    }  
      
    $query = "insert into contacts (firstname,lastname,address_line1,address_line2,address_city,address_state,address_postalcode,phone,email,company,comments) values (?,?,?,?,?,?,?,?,?,?,?)";  
    if (!($stmt = $mysqli->prepare($query))) {  
        echo "Prepare failed: (" . $stmt->errno . ") " . $stmt->error;  
        die;  
    }  
      
    if (!($stmt->bind_param("sssssssssss",   
        $contact->{'Name'}->{'First'},   
        $contact->{'Name'}->{'Last'},  
        $contact->{'Address'}->{'Line1'},  
        $contact->{'Address'}->{'Line2'},   
        $contact->{'Address'}->{'City'},  
        $contact->{'Address'}->{'State'},  
        $contact->{'Address'}->{'PostalCode'},  
        $contact->{'Phone'},  
        $contact->{'Email'},  
        $contact->{'Company'},  
        $contact->{'CommentsOrQuestions'}))) {  
          
        echo "Bind failed: (" . $stmt->errno . ") " . $stmt->error;  
    }  
      
    if (!($stmt->execute())) {  
        echo "Execute failed: (" . $stmt->errno . ") " . $stmt->error;      
    }  
?>

Next, configure your web server so that this script can receive an HTTP POST and insert the data into your database. For example, create a new script on your web server called, save_contact.php, so that when a POST is made to http://mysite.com/save_contact.php the script is executed. Enter the URL into the “Submit Entry Endpoint” option (located under “Post JSON data to a website” in your form’s Submission Settings) and save.

Submit Entry Endpoint

View your form and submit an entry Then, verify that the data was saved in the database.