How to POST, GET (and more) with Landbot

Updated 1 month ago by Fran

Sometimes we need to send data collected in the bot to external apps or servers, sometimes we want to bring data from outside sources to the bot, from API's, CRM's... either way we can achieve this by using HTTP Methods like POST and GET.

The block to do that is the Webhook block. As the name says, it can be use to connect with external webhooks (like Zapier)

But you can use the same block to contact an external server and make the most of RESTful operations with the following HTTP Methods: POST, GET, PUT, PATCH and DELETE

In this article we will show how to do POSTs and GETs with the Webhook block, the most frequently used.

Landbot Webhook blocks do not accept XML, only JSON

We do recommend using a tool like Postman before using the Webhook block for testing purposes

Anatomy of the Webhook Block

1. URL

In this section we will write the url (endpoint) to contact the external service.

Sometimes the url will have to be modified based on variables from the user, below are examples on how to implement the variables as a parameters, instead to send them through the body (Send data from variables input):

https://api.test.com/something/@name

https://api.test.com/something?name=@name

If your using the Hidden Fields functionality you can add them in the URL like in this url: https://api.test.com/something/@hidden_fieldvariable
It's important that the service that your are working with uses proper SSL Certifications, otherwise the Webhook won't work and no error is displayed. If you have your doubts you can check it in this site

2. Send data from variables (aka body)

Sometimes we need to send information in the body of the request instead of the URL, so here is the space to do it.

It is very important to use JSON standard otherwise we will have an alert error saying: JSON Parse error! and the border of the input area will be red, like in here:

Here the word email is not correctly formatted and missing " at the beginning of the word

Here is an example of a body formatted correctly in JSON:

{"email": "@email", "name": "@name", "custom-variable":"@customvariable"}

If you want to check if your input is correct you can check this service

3. Customize headers

By default, headers are disabled, if you want to use them, just switch it to YES

In this section we will set up (if needed) the header of the request. Like the body it needs to be properly formatted, otherwise we will have an error.

When we need to specify the "Content-Type", the most common one is JSON, so it will be like the one displayed in the placeholder:

{"Content-Type": "application/json"}

Note, that the Content-Type depend on the external service you are doing your request. Sometimes, the most common error is that the Content-Type is a different one: { "Content-Type" : "application/x-www-form-urlencoded" } Bear in mind that for this type, all the variables in the body of the requests, must have a value.

Header is also the place where, if needed, you should add the Authorization token like: {    "Authorization": "Token 1234567890ASDFGHJKL",    "Content-Type": "application/json"}

4. Customize method

By default, even if the "Customize method" is switched to "No", it will be a POST method

Once is switched to YES, you would be able to select a different range methods in the dropdown

Demo of a bot using the POST method to send information outside with the Webhook block

In this example we will show a bot that gathers data from a user, and once the inputs are collected, using the Webhook block, with the POST method sends the information to an outside service (for this example we used myjson.com):

LINK TO POST DEMO: https://landbot.io/u/H-98065-P2EAVTUYDNQKBNXR/index.html

As you can see in the demo, we gather the information and then we use the webhook to send the variables collected (in this case @name, @age and @address)

Here is how we will set up the Webhook block:

If you follow the bot, right after the Webhook block, we have a Callback block, that is because a request normally has a response, depending on the service. You might need to collect the information of the response, or just to know if the request was successful. For more information on the Callback block, you can check this article

Demo of a bot using the GET method to receive information from an external service with the Webhook block

For this case, we are going to gather some inputs from the user, and get information from an outside service, based on this inputs, once we have a response, we will use the callback to store the information from the response, and display

LINK TO GET DEMO: https://landbot.io/u/H-88667-EQTE5DA9396JG024/index.html

Like in the other bot demo, we capture information from the user, store them in Landbot variables and use them in the webhook as you can see below:

In detail:

URL: https://api.openweathermap.org/data/2.5/weather

Send data from variables: {"q":"@city","units":"metric","APPID":"f24f40b1c24505685fce3b8acd0fcffc"}

Customize headers: {"Content-Type":"application/json"}

Customize method: GET

As you can see after the webhook we use two callback block, one to select flow depending on the Status Response and other to store the content from the response, so that it can be displayed afterwards.


How did we do?