Table of Contents

Build a Telegram Bot with Landbot APIChat and Node JS

Pau Sanchez Updated by Pau Sanchez

These scripts and how to's are for developers, as a learning and example material on how to extend or modify some of the platform. Please, note that in case of Scripts and Workaround the Custom Support Team can deliver limited support.

Building a bot with our APIChat bot channel, allows you to build bots for other platforms like Telegram, using our simple visual builder interface. You just need to connect both platforms webhooks and translate the messages flowing from one side to the other, and we will show you how to do it here:

In Landbot

Creating an APIChat bot in Landbot builder

Once in the main dashboard, press BUILD A CHATBOT

And select APIChatbot

And the visual builder will create your first bot:

The best flow to get started and testing, would be one without media, and 2 messages:

Set up Ngrock To connect Landbot Hooks

We will use Ngrock to funnel the request from Landbot hooks, to do so from your terminal use this command:

ngrok http 80

We will have a url generated by ngrock were we can funnel temporarily our requests:

This is the url we will use:

https://fe45921740fe.ngrok.io

As we will funnel webhooks from Landbot and Telegram we will add customise the route:

https://fe45921740fe.ngrok.io/landbot_hook
Creating a Channel to receive Landbot Hooks

Now let's go back to Landbot, to the Channels section, where we will link the new created bot:

Select API

Select CREATE A NEW CHANNEL

In this screen we will add first the recently created url by ngrok, we can change it later if needed:

And press CONFIRM

Once is confirmed, we will have our Channel created, as you can see an Auth Token will be generated:

Now is time to link this channel to the bot we created early on, to do that press LINKED BOT:

Now, press the dropdown to search for the bot:

Select the bot and press Link Bot and press CONFIRM, and your bot will be linked to this channel. You can edit after again the details if needed.

Using Postman to trigger APIChat bot

Bots needs a message from the user to be initiated, to send a message we will use the following code:

curl --location --request POST 'https://chat.landbot.io/v1/send/' \
--header 'Authorization: Token <AUTH TOKEN GENERATED WITH THE CHANNEL>' \
--header 'Content-Type: application/json' \
--data-raw '{
    "message": {
        "type": "text",
        "message": "Hello"
    }
}'

So we will have our response, bear in mind that if no "id" is given to the user, Landbot will create a new one for you:

Inspect Hooks

We will use now the ngrok inspector to check from: http://localhost:4040/inspect/http

And as you can see below we will receive the first webhook from Landbot:

Great now we have Landbot APIChat receiving messages via API, and sending with to the hook the message that is designed in the logic

In Telegram

Create bot from BotFather

Now we can create a Telegram bot, to do that we will reach from the Telegram APP the bot father at botfather

Once there, we will use /newbot to start createing a new bot, just follow the instructions given by the botfather, by giving a name to the bot and to the username. Once we done that, botfather will give us an id. That id will be used after to set up the hooks and the auth for the node js api requests

Add Webhook with Postman

Now we will use Postman to set up the webhook url for the bot we just created, using the id that the botfather just gave us and the url from ngrock, but with a specific path. Below you can see an example

curl --location --request POST 'https://api.telegram.org/bot<id given by the bot father>/setwebhook' \
--header 'Content-Type: application/json' \
--data-raw '{"url":"https://fe45921740fe.ngrok.io/telegram_hook"}'

In case you want to check the status of that webhook here is the request:

curl --location --request GET 'https://api.telegram.org/bot<id given by the bot father>/getWebhookInfo'
Test and Inspect Hooks

Now if you go to the bot you created in Telegram, and send a message, you will be able to see in the logs from ngrock (http://localhost:4040/inspect/http) the message details

As you can see, you will get some 502 status requests. Don't worry, once the our NODE JS APP is set up accordingly we will fix that.

Connect Landbot and Telegram with Node JS API

Create Node project

To do that, we will use the terminal of Visual Studio Code, and set up a node project in a folder called Landbot_Telegram :

npm init -y
Main file

For this example all the code needed to communicate between both platforms, will be in a file called index.js, that we will add to our recently created folder.

touch index.js

and install the required NPM packages

npm i express body-parser axios

Below is the code that you can copy and paste for your project

This file is an example of a simple integration, it supports sending Text messages to Landbot, and sending from Landbot some features like Photos, GIFS and Buttons.

Please feel free to customise the code to your needs
NPM Packages

For this project we will use express, body-parser and axios.

npm i express body-parser axios

Auth and tokens

The index.js file already has the variables created, you just need to replace accordingly:

// LANDBOT APIChatbot details
const landbot_token = "XXXXXXXXXXXXX" // Landbot API Channel TOKEN
const landbot_url = "https://chat.landbot.io/v1/send" // Landbot API base url
// OTHER PLATFORM API details, in this case Telegram
const telegram_bot_id = "01234566789:XXXXX_XXXXXX_XXXXXXXX" // Bot id given by the botfather
const telegram_url= "https://api.telegram.org/bot" // Telegram API base url
node index.js to Run locally

Now initiate the express app from your terminal

node index.js
Test

Once is initiated, send a message from Telegram. That will trigger the app, and send a message to Landbot, and Landbot will reply with a message that will be sent back to Telegram

In the first attempt, Telegram might trigger twice Landbot bot (due to the /start test). In the following message it will be corrected

And you can see how those message had been sent by both platforms in the ngrock logs to the specific hook endpoints:

Important Tips!

Order of the messages (received and sent)

Even if messages by default are sent to the hook in order, as you have seen in the code, there might be times where it comes in a different order. The best approach will be to check the timestamp of the message as a reference.

At the same time, be aware that Telegram API doesn't offer the possibility to set up a prior order has how the messages have to be displayed.

For that reason, short sequences offer much better results

First block ${body}

The best approach when building bots for channels like Telegram, where the user has free input to start interacting with the bot, is to capture the first input. Thanks to do that we will be able to set up conditions.

To capture the firs input, please check this article

Individual messages and sequences length

When building the bot, you can create blocks that contains more than one message or media, please avoid it. It will be much simpler to control the message delivery, order and process

Sequence of messages, are going to start after a user input/selection block is required and stop in the next user input/selection block. For better control of the order of the messages, avoid sequences of more than 4 blocks. The ideal built is like in the picture above.

Global Keywords block

The global keywords block allow you to set up paths, based on a keyword input from the user (not bot or agent). It is very handy to redirect the user to specific flows. For more information, please check this article

When used, global keywords takes priority over other inputs used. Be careful to do not use the same keywords that might be used in other blocks like Buttons

Keyword Options

Very similar to the buttons block, this block has been designed for open text channels like Telegram. It offers the chance to select a number or a text. For more information, please check this article

Chat Section

When testing the bot, it is very handy to see what is going on, like the messages and variables that had been used. Also, if you want to close the chat session to start from the beginning it will be simple to do it from this section. Please check more about the chat section here

Ngrock

If you choose to work with Ngrock in the free mode you must be aware of a couple of things that will help you to spot some issues:

1. The url will change after few hours. It is normal that after few ours of testing to forget about it.

2. Ngrock has a limitation of requests per second. That is important as messages coming from the bot (landbot) will send many messages at once, and Ngrock might stop working as expected. When testing be aware of it

How did we do?

Building a Slack APP Bot with Landbot APIChat and Node JS

Contact