Let's create a story with a webhook that returns responses
Webhooks
Webhooks allow your bot to send and receive data to external internet APIs.
Webhooks allow you to connect your chatbot to your web services. Pass information from interactions and retrieve the result. Your bot is able to send and receive information from your external internet-connected systems with REST APIs.
Webhooks empower your chatbot to integrate with numerous external internet-connected systems (emails, business software, ERP and CRM platforms, and helpdesk software.)
Webhooks Page
Your bot uses these webhooks in its stories to:
Send information (generated leads, signups, queries, and emails)
Receive information (status updates, alerts, weather information, and bus timings.)
Creating a New Webhook
To create a new webhook, click on New Webhook.
Just like any other API definition, a webhook has a request and a response.
The request should be configured on the BotDistrikt platform
The response should be configured on your API server
Webhook Request
The webhook's request is configured on the BotDistrikt platform. These are the following fields you have to configure for every webhook.
Field
Description
Name
A unique name to describe what the webhook does
Method
GET or POST
URL
The URL of your API to be called
Query Params
The data parameters to send to your URL. In a GET request, these are sent as query parameters directly on the URL, while a POST request, these are sent as body parameters in JSON
Here is an example of a webhook configuration that gets a random number
The example above shows a simple webhook that calls the URL https://botdistrikt-webhook-examples.glitch.me/random_number with the query params min=10&max=20.
Webhook Response
The webhook's response has to be generated by your API server. Every webhook response should be in JSON format, and should contain at least one of the following keys:
responses
responses can be an array of strings. These strings add to your bot's response to your user. Take a look at how it is done in this example
Let's see how the response is displayed to the user
memory
memory should be an object of key-value pairs that are assigned to the user session's memory. Use these keys to remember the user's current session (product or topic they were talking about) or use the memory merge tags in responses.
For example:
Let's create a story with a webhook that returns memory. Notice the merge tag {{memory.favourite-thing}}.
Let's see how the response is displayed to the user. Notice the merge tag {{memory.favourite-thing}} is replaced with cars.
user_attributes
user_attributes should be an object of key-value pairs that are assigned to the user's profile. These keys can then be used to segment users in the Users dashboard and to create targeted groups for personalized stories and broadcasts. Take a look at this example:
Let's create a story with a webhook that returns memory. Notice the merge tag {{user.age}}.
Let's see how the response is displayed to the user. Notice the merge tag {{user.age}} is replaced with 28.
quickreplies
quickreplies can be an array of strings. These quick replies display as options to your user. Take a look at how it is done in this example
Let's create a story with a webhook that returns quickreplies. These display as quick replies to the user
Let's see how the response is displayed to the user.
Rich Responses
You may return rich responses from your webhooks for better user engagement. These responses can include rich components such as buttons, images, cards, documents, audios, and videos. For this, responses must be an array of JSON objects instead of an array of strings. The following data structures can be used for rich responses.
Image response
For an image response, use the following data structure
Text with Buttons response
To include buttons within your text response, use the following data structure
To support most messaging apps, use a maximum of 3 buttons per text response
Cards response
To display a carousel of cards, use the following data structure
Cards are paginated by default at 8 cards. If you would like to increase or reduce the number of cards to show per page, change the value of page_limit in the webhook response
To support most messaging apps, use a maximum of 3 buttons per card
Document Response
To display a document response that a user can download, use the following data structure
Remember to include the file extension within the document's name to allow the user to open it using the intended file format, e.g. pdf, docx, pptx, txt
Audio response
To show a playable audio file to the user, use the following data structure
Remember to include the file extension within the audio's name to allow the user to open it using the intended file format, e.g. wav, mp3
Video response
To display a playable video file to the user, use the following data structure
Remember to include the file extension within the video's name to allow the user to open it using the intended file format, e.g. mp4, mpg
Testing Webhooks
You may test your webhooks using the Test Webhook button within the webhook editor
When you click the button, a window will pop up with two panes. The left pane allows you to edit the inputs of the webhook directly, and the right pane shows you the output - the preview of what the webhook's response will look like within the chatbot's response. You can click the Retest button below the right pane to refresh the output from the webhook
Remember to substitute variables within your URL, Headers, Query Params, and JSON Body Params with string values while testing. E.g. if you are sending a variable {{user.first_name}} in any of the webhook fields, remember to change it to the user's actual first name, e.g. John. The Webhook Tester assumes the strings sent in the request are the final values.
Last updated