---
title: "How to: Consume Payloads Using Webhooks"
slug: "how-to-consume-payloads-using-webhooks"
description: "Learn to configure a Postback module to receive Google Forms webhooks and send emails via SendGrid upon payload completion."
updated: 2026-02-02T20:00:01Z
published: 2026-02-03T15:48:58Z
canonical: "docs.unqork.io/how-to-consume-payloads-using-webhooks"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.unqork.io/llms.txt
> Use this file to discover all available pages before exploring further.

# How to: Consume Payloads Using Webhooks

**UDesigner**

This how-to guide demonstrates how to configure an application to **consume payloads using webhooks**, using SendGrid to send an email when the payload is complete. For this configuration, you'll need a Postback module that listens for the Google Forms webhook.

## Configure the Postback Module

Begin by creating a **Postback module** that runs when it receives the webhook request. When finished, it sends an email with the contents of the Google Form. To use a webhook, you need to set up an API module.

> [!NOTE]
> These instructions assume you have a workspace open, saved, and with a title.

To create an API module in your application:

1. At the top right of your Application page, click **+ Create New**.
2. Select **Module**. The Create Module modal displays.
3. In the **Module** **Name*** field, enter `postbackConsumePayloadModule`.
4. From the **Module** **Type*** drop-down, select **API**.
5. Click **Create**.

By default, the API module contains four [Panel](/v1/docs/panel-component) components to help with an API setup: **panelInfo**, **panelRequest**, **panelResponse**, and **panelConfig**.

### Update the `panelInfo` Panel Component

Here you'll update the `panelInfo` **Panel** component.

#### Update the description HTML Element Component

The `panelInfo` **Panel** component contains an [HTML Element](/v1/docs/html-element-component) component that describes its purpose. You can update this component to display any information you want when building or using the webhook.

1. In the `panelInfo` **Panel** component, hover over the `description` **HTML Element** component.

A 5-button toolbar displays above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Screenshot 2025-09-15 202009(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**Settings**) button.
3. In the **Content** field, enter `Postback module to recive webhooks from Google Forms and send Email for each response.`.
4. Click the **Save Component**.

#### Update the `method` Hidden Component

1. In the `panelInfo` **Panel** component, hover over the `method` **Hidden** component.

A 5-button toolbar displays above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Screenshot 2025-09-15 202009(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**Settings**) button.
3. In the **Default Value** field, enter `POST`.
4. Click **Save Component**.

### Update the `panelRequest` Panel Component

1. In the `panelRequest` **Panel** component, hover over to the `requestParameter` **Hidden** component.

A 5-button toolbar displays above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Screenshot 2025-09-15 202009(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**Settings**) button.
3. In the **Property ID** and **Label Text** fields, enter `_request`.
4. Set **Store Data in Database** ![A toggle switch icon indicating an on state for user interface settings.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/toggledOn.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) **(ON)**.
5. Click **Save & Close**.

### Configure the `panelConfig` Panel Component

Now, configure a [Hidden](https://docs.unqork.io/docs/hidden-component) component in the `panelConfig` **Panel** component.

#### Configure a Hidden Component

1. Drag and drop a **Hidden** component inside the `panelConfig` **Panel** component.
2. In the **Property ID** and **Label Text** fields, enter `answerText`.
3. In the **Default Value** field, enter `Default`.
4. Click **Save Component**.

### Configure the Data Workflow Component

Next, configure a [Data Workflow](https://docs.unqork.io/docs/data-workflow-component) component that receives the request from your Google Form and outputs it into a Hidden component.

1. Drag and drop a **Data Workflow** component inside the `panelConfig` **Panel** component, below the `answerText` **Hidden** component.
2. In the **Property ID** and **Canvas Label Text** fields, enter `dwfGetAnswer`.

#### Configure the Input Operator

1. Drag and drop an **Input** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Input |
| Component | _request |
| Required | Yes |
| Source | Default |

#### Configure the Get Operator

1. Drag and drop a **Get** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Get |
| Label |  |
| Path | body.body |
3. Connect the output port (right) of the **Input** operator to the input port (left) of the **Get** operator.

#### Configure the Output Operator

1. Drag and drop an **Output** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Output |
| Component | answerText |
| Action | value |
3. Connect the output port (right) of the **Get** operator to the input port (left) of the **Output** operator.

![A static image displaying the Data workflow interface showing input, output, and console components for processing requests.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/panelConfig_DW.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)
4. Click **Save Component**.

### Update the `pluginCreateSubmission` Plug-In Component

This [Plug-In](/v1/docs/plug-in-component) component takes the text retrieved from your Google Form and sends an email using SendGrid.

1. In the `panelConfig` **Panel** component, hover over the `pluginCreateSubmission` **Plug-In** component.

A 5-button toolbar displays above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Screenshot 2025-09-15 202009(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**Settings**) button.
3. In the **Property ID** and **Canvas Label Text** fields, enter `pluginSendEmail`.
4. From the **Service Type** drop-down, select **External**.
5. From the **External Service** drop-down, select **SendGrid**.
6. In the **Data Source URL** field, enter `mail/send`.
7. From the **Request Type** drop-down, select **Post**.
8. In the **Inputs** table, enter the following:

| Property ID | Mapping | Required |
| --- | --- | --- |
| 'no-reply@unqork.io' | from.email | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Checked_Box_Blue(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (checked) |
| '<enter your email address>' | personalizations[0].to[0].email | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Checked_Box_Blue(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (checked) |
| 'A new response has been received!' | subject | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Checked_Box_Blue(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (checked) |
| 'text/html' | content[0].type | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Checked_Box_Blue(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (checked) |
| answerText | content[0].value | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Checked_Box_Blue(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (checked) |

![A static image displaying the Configuration settings for email plugin using SendGrid and input parameters for sending emails.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/panelConfig_Plugin1.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)
9. Drag and drop the `pluginCreateSubmission` **Plug-In** component component below the `answerText` **Hidden** component.
10. Click **Save Component**.

### Update the `initCreateSubmission` Initializer Component

Next, update the [Initializer](https://docs.unqork.io/docs/initializer-component) component to trigger the `pluginSendEmail` **Plug-In** and `dwfGetAnswer` **Data Workflow** components.

1. In the `panelConfig` **Panel** component, hover over the `initCreateSubmission` **Initializer** component.

A 5-button toolbar displays above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Screenshot 2025-09-15 202009(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**Settings**) button.
3. In the **Property ID** and **Canvas Label Text** fields, enter `initSendEmail`.
4. In the **Outputs** table, enter the following:

| Property ID | Type | Value |
| --- | --- | --- |
| dwfGetAnswer | trigger | GO |
| pluginSendEmail | trigger | GO |

![A static image displaying the settings for email trigger actions in a submission initializer interface.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/panelconfig_INIT.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)
5. Drag and drop the `initCreateSubmission` **Initializer** component above the `pluginSendEmail` **Plug-In** component.
6. Click **Save Component**.
7. **Save** the module.

### Enable Execute via Proxy

Now you'll access the Module Settings in your new module. The point of these setting changes is to enable the **Execute via Proxy** endpoint for the webhook, and setting the **Anonymous** role's permissions to `Write`. Once enabled, you can receive requests from your webhook service.

1. In the Module Builder, click the ![ellipsisButtonDummy.jpg](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/ellipsisButtonDummy.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**ellipsis**) button.
2. Select **Module** **Settings**.
3. To the left of the modal, click Module **Settings**.
4. Set **Act as Super-user When Server Side Executing** to ![A toggle switch icon indicating an on state for user interface settings.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/toggledOn.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) **(ON)**.

> [!NOTE]
> This step is for demonstration purposes only.
5. To the left of the modal, click **User Permissions**.
6. Set **Allow Access to Anonymous Users** to ![A toggle switch icon indicating an on state for user interface settings.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/toggledOn.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) **(ON)**.
7. From the Anonymous role's **Permission** drop-down, select **Write**.

![A static image displaying the settings menu displaying role-based access control and user permissions options.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/panel_ModuleSettings.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)
8. Click **Save & Close**.
9. **Save** your module.

Here’s how the completed Postback module looks in the Module Builder:

![A static image displaying the Configuration panel for sending emails via Google Forms webhooks and response handling.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/panel_ModuleBuilder.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)

### Copy the Unqork Environment URL and Module ID

To set up the Google Form, copy the environment domain and the module ID from the address bar and save them for use in the next steps.

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/API_Consuming_Payloads_Using_Webhooks_03.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)

## Configure the Google Form

Now, create and configure the Google Form.

### Create the Google Form

1. Open a Google Form.
2. At the top left of the page, enter `Unqork Webhook Test`.
3. Replace **Untitled Form** with `Test Question`.
4. From the question type drop-down, select **Paragraph**.

### Configure the Google Form Apps Script

1. At the top right, click the ![files](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Component_Settings_Ellipses.png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**More**).
2. Select **Apps** **Script**.
3. At the top left, in the **Project Title Field**, rename the project to `Unqork Webhook Test`.
4. Copy the following code and paste it into the **Script Editor**:

```plaintext
function onFormSubmit(e) {
                    var url = "https://{environment}x.unqork.io/fbu/uapi/modules/{moduleId}/api/{path}";
                    var form = FormApp.openById('{form Id}');
                    var formResponses = form.getResponses();
                    var formResponse = formResponses[formResponses.length - 1];
                    var itemResponses = formResponse.getItemResponses();
                    var answerText = itemResponses[0].getResponse();
                    var data = {
                    "body": answerText
                    }
                    var options = {
                    "method": "post",
                    "headers": {
                    "Content-Type": "application/json"
                    },
                    "payload": JSON.stringify(data)
                    };
                    var response = UrlFetchApp.fetch(url, options);
                }
```
5. In the `var url` line, replace the following items with the environment domain and module ID you copied in the **Copy the Unqork Environment and Module ID** section of this article:

After pasting the values, ensure the curly braces (`{}`) are removed.

| Setting | Value |
| --- | --- |
| {environment} | Enter your environment name. |
| {moduleId} | Enter your module ID. |
| {path} | Enter a path. > [!NOTE] > This can be anything you want. This should be descriptive based on what the webhook accomplishes. |
6. In the `var form` line, replace the following:

| Setting | Value |
| --- | --- |
| {form ID} | Enter your form ID. The form ID is the string of characters in the Google Form URL between the `d` and `edit`. ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/API_Consuming_Payloads_Using_Webhooks_04.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) |
7. Click **Save Project to Drive**.
8. Click the **Deploy** drop-down.
9. Select **New Deployment**.
10. Click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/AppBuildButton_Settings(45).jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**gear**) icon.
11. Select **Web App**.
12. In the **Description** field, enter `Unqork webhook test`.
13. Click **Deploy**. If a pop-up displays asking you to authorize access, click **Authorize Access**, then click **Done**.

### Configure the Google Form Apps Script Triggers

1. From the menu to the left, select **Triggers** (**clock icon**).
2. Click **+ Add Trigger**. A pop-up modal displays.
3. Set the following settings:

| Setting | Value |
| --- | --- |
| Choose which function to run | onFormSubmit |
| Choose which deployment should run | Head |
| Select event source | From form |
| Select event type | On form submit |
4. Click **Save**.

**Classic Designer**

This how-to guide demonstrates how to configure an application to **consume payloads using webhooks**, using SendGrid to send an email when the payload is complete. For this configuration, you'll need a Postback module that listens for the Google Forms webhook.

## Configure the Postback Module

Begin by creating a **Postback module** that runs when it receives the webhook request. When finished, it sends an email with the contents of the Google Form. To use a webhook, you need to set up an API module.

> [!NOTE]
> These instructions assume you have a workspace open, saved, and with a title.

To create an API module in your application:

1. At the top right of your Application page, click **+ Create New**.
2. Select **Module**. The Create Module modal displays.
3. In the **Module** **Name*** field, enter `postbackConsumePayloadModule`.
4. From the **Module** **Type*** drop-down, select **API**.
5. Click **Create**.

By default, the API module contains four [Panel](/v1/docs/panel-component) components to help with an API setup: **panelInfo**, **panelRequest**, **panelResponse**, and **panelConfig**.

### Update the `panelInfo` Panel Component

Here you'll update the `panelInfo` **Panel** component.

#### Update the description HTML Element Component

The `panelInfo` **Panel** component contains an [HTML Element](/v1/docs/html-element-component) component that describes its purpose. You can update this component to display any information you want when building or using the webhook.

1. In the `panelInfo` **Panel** component, hover over the `description` **HTML Element** component.

A 5-button toolbar displays above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Screenshot 2025-09-15 202009(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**Settings**) button.
3. In the **Content** field, enter `Postback module to recive webhooks from Google Forms and send Email for each response.`.
4. Click the **Save & Close**.

#### Update the `method` Hidden Component

1. In the `panelInfo` **Panel** component, hover over the `method` **Hidden** component.

A 5-button toolbar displays above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Screenshot 2025-09-15 202009(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**Settings**) button.
3. In the **Default Value** field, enter `POST`.
4. Click **Save & Close**.

### Update the `panelRequest` Panel Component

1. In the `panelRequest` **Panel** component, hover over to the `requestParameter` **Hidden** component.

A 5-button toolbar displays above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Screenshot 2025-09-15 202009(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**Settings**) button.
3. In the **Property ID** and **Label Text** fields, enter `_request`.
4. Set **Store Data in Database** ![A toggle switch icon indicating an on state for user interface settings.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/toggledOn.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) **(ON)**.
5. Click **Save & Close**.

### Configure the `panelConfig` Panel Component

Now, configure a [Hidden](https://docs.unqork.io/docs/hidden-component) component in the `panelConfig` **Panel** component.

#### Configure a Hidden Component

1. Drag and drop a **Hidden** component inside the `panelConfig` **Panel** component.
2. In the **Property ID** and **Label Text** fields, enter `answerText`.
3. In the **Default Value** field, enter `Default`.
4. Click **Save Component**.

### Configure the Data Workflow Component

Next, configure a [Data Workflow](https://docs.unqork.io/docs/data-workflow-component) component that receives the request from your Google Form and outputs it into a Hidden component.

1. Drag and drop a **Data Workflow** component inside the `panelConfig` **Panel** component, below the `answerText` **Hidden** component.
2. In the **Property ID** and **Canvas Label Text** fields, enter `dwfGetAnswer`.

#### Configure the Input Operator

1. Drag and drop an **Input** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Input |
| Component | _request |
| Required | Yes |
| Source | Default |

#### Configure the Get Operator

1. Drag and drop a **Get** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Get |
| Label |  |
| Path | body.body |
3. Connect the output port (right) of the **Input** operator to the input port (left) of the **Get** operator.

#### Configure the Output Operator

1. Drag and drop an **Output** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Output |
| Component | answerText |
| Action | value |
3. Connect the output port (right) of the **Get** operator to the input port (left) of the **Output** operator.

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/API_Consuming_Payloads_Using_Webhooks_05.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)
4. Click **Save**.

### Update the `pluginCreateSubmission` Plug-In Component

This [Plug-In](/v1/docs/plug-in-component) component takes the text retrieved from your Google Form and sends an email using SendGrid.

1. In the `panelConfig` **Panel** component, hover over the `pluginCreateSubmission` **Plug-In** component.

A 5-button toolbar displays above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Screenshot 2025-09-15 202009(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**Settings**) button.
3. In the **Property ID** and **Canvas Label Text** fields, enter `pluginSendEmail`.
4. From the **Service Type** drop-down, select **External**.
5. From the **External Service** drop-down, select **SendGrid**.
6. In the **Data Source URL** field, enter `mail/send`.
7. From the **Request Type** drop-down, select **Post**.
8. In the **Inputs** table, enter the following:

| Property ID | Mapping | Required |
| --- | --- | --- |
| 'no-reply@unqork.io' | from.email | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Checked_Box(7).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (checked) |
| '<enter your email address>' | personalizations[0].to[0].email | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Checked_Box(7).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (checked) |
| 'A new response has been received!' | subject | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Checked_Box(7).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (checked) |
| 'text/html' | content[0].type | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Checked_Box(7).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (checked) |
| answerText | content[0].value | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Checked_Box(7).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (checked) |

![A static image displaying the settings for a plugin integration with SendGrid for email sending functionality.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/CD_panelConfig_DW.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)
9. Drag and drop the `pluginCreateSubmission` **Plug-In** component below the `answerText` **Hidden** component.
10. Click **Save.**

### Update the `initCreateSubmission` Initializer Component

Next, update the [Initializer](https://docs.unqork.io/docs/initializer-component) component to trigger the `pluginSendEmail` **Plug-In** and `dwfGetAnswer` **Data Workflow** components.

1. In the `panelConfig` **Panel** component, hover over the `initCreateSubmission` **Initializer** component.

A 5-button toolbar displays above the component on hover-over.
2. Using the toolbar, click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Screenshot 2025-09-15 202009(1).png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**Settings**) button.
3. In the **Property ID** and **Canvas Label Text** fields, enter `initSendEmail`.
4. In the **Outputs** table, enter the following:

| Property ID | Type | Value |
| --- | --- | --- |
| dwfGetAnswer | trigger | GO |
| pluginSendEmail | trigger | GO |

![A static image displaying the Display settings for email initialization with action triggers for responses.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/CD_panelConfig_INIT.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)
5. Click **Save & Close**.
6. **Save** the module.

### Enable Execute via Proxy

Now you'll access the Module Settings in your new module. The point of these setting changes is to enable the **Execute via Proxy** endpoint for the webhook, and setting the **Anonymous** role's permissions to `Write`. Once enabled, you can receive requests from your webhook service.

1. In the Module Builder click the ![ellipsisButtonDummy.jpg](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/ellipsisButtonDummy.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**ellipsis**) button.
2. Select **Module** **Settings**.
3. To the left of the modal, click **Module** **Settings**.
4. Set **Act as Super-user When Server Side Executing** to ![A toggle switch icon indicating an on state for user interface settings.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/toggledOn.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) **(ON)**.

> [!NOTE]
> This step is for demonstration purposes only.
5. To the left of the modal, click **User Permissions**.
6. Set **Allow Access to Anonymous Users** to ![A toggle switch icon indicating an on state for user interface settings.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/toggledOn.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) **(ON)**.
7. From the Anonymous role's **Permission** drop-down, select **Write**.

![A static image displaying the Module permissions settings with role-based access control options displayed for user roles.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/CD_PanelSettings.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)
8. Click **Save.**
9. **Save** your module.

Here’s how the completed Postback module looks in the Module Builder:

![A static image displaying the Configuration panel for sending emails via Google Forms webhook responses.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/CD_payloadModuleBuilder.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)

### Copy the Unqork Environment and Module ID

To set up the Google Form, copy the environment domain and the module ID from the address bar and save them for use in the next steps.

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/API_Consuming_Payloads_Using_Webhooks_03.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D)

## Configure the Google Form

Now, create and configure the Google Form.

### Create the Google Form

1. Open a Google Form.
2. At the top left of the page, enter `Unqork Webhook Test`.
3. Replace **Untitled Form** with `Test Question`.
4. From the question type drop-down, select **Paragraph**.

### Configure the Google Form Apps Script

1. At the top right, click the ![files](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Component_Settings_Ellipses.png?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**More**).
2. Select **Apps** **Script**.
3. At the top left, in the **Project Title Field**, rename the project to `Unqork Webhook Test`.
4. Copy the following code and paste it into the **Script Editor**:

```plaintext
function onFormSubmit(e) {
                    var url = "https://{environment}x.unqork.io/fbu/uapi/modules/{moduleId}/api/{path}";
                    var form = FormApp.openById('{form Id}');
                    var formResponses = form.getResponses();
                    var formResponse = formResponses[formResponses.length - 1];
                    var itemResponses = formResponse.getItemResponses();
                    var answerText = itemResponses[0].getResponse();
                    var data = {
                    "body": answerText
                    }
                    var options = {
                    "method": "post",
                    "headers": {
                    "Content-Type": "application/json"
                    },
                    "payload": JSON.stringify(data)
                    };
                    var response = UrlFetchApp.fetch(url, options);
                }
```
5. In the `var url` line, replace the following items with the environment domain and module ID you copied in the **Copy the Unqork Environment and Module ID** section of this article:

After pasting the values, ensure the curly braces (`{}`) are removed.

| Setting | Value |
| --- | --- |
| {environment} | Enter your environment name. |
| {moduleId} | Enter your module ID. |
| {path} | Enter a path. > [!NOTE] > This can be anything you want. This should be descriptive based on what the webhook accomplishes. |
6. In the `var form` line, replace the following:

| Setting | Value |
| --- | --- |
| {form ID} | Enter your form ID. The form ID is the string of characters in the Google Form URL between the `d` and `edit`. ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/API_Consuming_Payloads_Using_Webhooks_04.jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) |
7. Click **Save Project to Drive**.
8. Click the **Deploy** drop-down.
9. Select **New Deployment**.
10. Click the ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/AppBuildButton_Settings(45).jpg?sv=2026-02-06&spr=https&st=2026-11-08T10%3A18%3A18Z&se=2026-11-08T11%3A18%3A18Z&sr=c&sp=r&sig=B7UMSmZwWgV%2F3%2BijGlE3oGju%2BebWKYGDDmKTbmVdy14%3D) (**gear**) icon.
11. Select **Web App**.
12. In the **Description** field, enter `Unqork webhook test`.
13. Click **Deploy**. If a pop-up displays asking you to authorize access, click **Authorize Access**, then click **Done**.

### Configure the Google Form Apps Script Triggers

1. From the menu to the left, select **Triggers** (**clock icon**).
2. Click **+ Add Trigger**. A pop-up modal displays.
3. Set the following settings:

| Setting | Value |
| --- | --- |
| Choose which function to run | onFormSubmit |
| Choose which deployment should run | Head |
| Select event source | From form |
| Select event type | On form submit |
4. Click **Save**.

APIs (application programming interfaces) are a set of protocols and definitions developers use to build and integrate application software. APIs act as the connective tissue between products and services.

A modal is a window that appears on top of the content you are currently viewing.

A Property ID is the unique field ID used by Unqork to track and link components in your module.

Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field.

Canvas Label Text indicates the purpose of the corresponding field or component. For non-input components, the Canvas Label Text isn't end-user facing, and only appears in the .