Connect with your Backend

When you want to provide users with information stored on your server, you can easily do so through our API Integration module.

How does API integration work?

Step - 1: Add an API

  • Refer to the Integration tab from Dashboard Sidebar and click on Add New API(Provide a name to the API as applicable for future reference).

  • You can select two types of methods:

    • GET Method: You should select this if you don't want all the customer data. Here you can add a header and a parameter to your API.

    • POST Method: You should select this if you want all the customer data. You will get the information of the customer that has triggered this. You can add a header and additional parameters to your API as well.

  • You can show the desired data through different blocks:

    • Text Block: Data is shown as plain text.

    • Image Block: Data is shown as an image.

    • Gallery Block: Data is shown in the form of a Gallery carousel (best suited to showcase products).

    • Buttons Block: Data is shown in the form of buttons for users to press and access.

    • Quick Reply Block: Data is shown on the floating buttons for users to press and access.

API integration is available in paid plans only.

Always use a secret header token to protect your API end from unwanted usage.

Step - 2: Add the API in Builder:

  1. Text Block: When you add a ‘Text Block’ use ‘<<’ on the text field and you’ll see a list of all the APIs you have created. Select the suitable one.

  2. Image Bloc: When you add an 'Image Block', you'll see the optionCreate an API image block. Click it and you’ll see the list of APIs. Select the suitable one.

  3. Gallery Block: When you add a ‘Gallery Block’, you’ll see the option Create an API Gallery Item. Press on it and you’ll see the list of APIs. Select the suitable one.

  4. Button Block: When you add a ‘Button Block’, you’ll see the option Create an API button. Press on it and you’ll see the list of APIs. Select the suitable one.

  5. Quick Reply Block: When you add a ‘Quick Reply Block’, you'll see the option Create an API button. Press on it and you’ll see the list of APIs. Select the suitable one.

By using the blocks mentioned above, you can show the data fetched through an API. For different blocks on the Builder, here’s how you add the APIs:

Step - 3: Receive data in POST Request

If you use a POST request, your API endpoint will receive the following data format at the:

{
"uid": 1, #unique customer id
"platform_id": 1, #id of the channel
"bot_enabled": true|false,
"avatar": "" # url,
"first_name": "Lorem",
"last_name": "Ipsum",
"full_name": "Lorem Ipsum",
"gender": "male|female",
"timezone": 6.0,
"locale": "",
"language": "",
"phone": "",
"email": "",
"created_at": "2020-10-16 06:41:59.039735+00:00",
"last_message_text": "", # User's last message
"last_message_time": "",
...
# Key-Value pair depending on the saved attributes
}

To get API request in your backend, you need to connect the channel.

Step - 4: Return data

For these APIs, to trigger any specific block, return the following data structure:

Text Block
Image Block
Buttons Block
Quick Reply Block
Gallery Block
Text Block
{
"data": "text", # string - this will contain the actual data
"success": true/false, # boolean
"message": "Successful", # string - this can be used for keeping logs
"attributes": {
# optional key-value pair to save in customer data
},
"status": 200 # integer
}
Image Block
{
"data": {
"type": "image" | "audio" | "video", # string
"url": "https://amazon.com/pic.png" # string url (jpg or png preferred)
}, # - this will contain the actual data
"success": true/false, # boolean
"message": "Successful", # string - this can be used for keeping logs
"attributes": {
# optional key-value pair to save in customer data
},
"status": 200 # integer
}
Buttons Block
{
"data": [
{
"title": "Hello World", # string - button title
"type": "url", # string - "sequence"/"url"/"phone"
"extra": "extra payload", # string (optional)
"value": "https://getalice.ai/", # value of the button i.e. url, sequence_id
},...
]
"success": true/false, # boolean
"message": "Successful", # string
attributes": {
# optional key-value pair to save in customer data
},
"status": 200 # integer
}
Quick Reply Block
{
"data": [
{
"title": "Hello World", # string - button title
"type": "url", # string - "sequence"/"url"
"extra": "extra payload", # string (optional)
"value": "https://getalice.ai/", # value of the button i.e. url, sequence_id
},...
]
"success": true/false, # boolean
"message": "Successful", # string
attributes": {
# optional key-value pair to save in customer data
},
"status": 200 # integer
}
Gallery Block
{
"data": [
{
"title": "Hello World", # string - gallery title
"subtitle: "Hello World", # string - gallery item subtitle
"image": "" # image url (optional)
"url": "" # redirection url (optional)
"buttons": [
{
"title": "Hello World", # string - button title
"type": "url", # string - "sequence"/"url"
"extra": "extra payload", # string (optional)
"value": "https://getalice.ai/", # value of the button i.e. url, sequence_id
}, ...
]
}, ...
]
"success": true/false, # boolean
"message": "Successful", # string
attributes": {
# optional key-value pair to save in customer data
},
"status": 200 # integer
}

If you want to use newline in data, use \n

You can update customer attributes from your backend by passing data in the attributes key.

You need to return the data within 5 seconds.