Table of Contents

AI in WhatsApp

Abby Updated by Abby

WhatsApp can be even more powerful when we integrate AI, in this example we'll explain how you can use OpenAI in your WhatsApp flow

This is a fairly simple integration and no coders should be able to easily implement this

In order to follow along, you'll need an OpenAI account with an API key, as well as a Landbot Whatsapp test account

This is what the final result will look like to the end user:

Here's our builder:

We'll go step by step here, everything is there for a reason!

1. Reply Buttons

The user input is mandatory, so after that we'll add a Reply buttons block, giving the user the option to continue to the AI, or talk to a human

We've also mentioned that they can type STOP to stop the bot, or type Human at anytime

Both of these keywords will redirect them to the Global keywords block, but we'll go over that later

Here's what the Reply buttons block looks like inside:

2. Outputs

We'll connect the 'Talk to human' button to a Human takeover block, of course this is optional

The 'Let's go' button will be connected to a Set variable block

3. Set Variable Block

In the set variable block, we'll enter the prompt text we want the user to see at the beginning of the AI interaction

The reason we need this Set Variable block, is that on a second visit to the bot, the user would otherwise see the last response from the AI, with the prompt text we create a clean experience for the user, so we are resetting the variable @response to a blank slate

4. User Input

We'll connect the Set Variable block to a Text Question block, in the text field we'll enter the variable @response, and we'll save the input as @text

The first time the user goes through the flow, they'll see the prompt text, after that it will be replaced with the AI output, this will make it look like a fluid conversation with the AI

This Text Question block will then be connected to a Webhook block

5. Webhook Block

In the Webhook block we'll add the following to the url: https://api.openai.com/v1/completions

Then we will turn on Header and in the key field we'll put Authorization in the value we'll put Bearer followed by the API key for OpenAI.

The format will look like this: Bearer XXX_YOUR_API_KEY_XXX

6. Webhook Body

We'll turn on 'Customize Body' and add the following:

{

"model": "text-davinci-003",

"prompt": "@text",

"temperature": 0,

"max_tokens": 200

}

7. Test Request

Next we'll need to test our request, we'll do that by adding a test value for the variable @text

8. Save Response

Now that we've tested the request we should have gotten a 200 response

Here's what it should look like:

From this response we only want one part, that's the 'text', so we'll toggle on 'Save response' and click on the purple banner, we'll select choices.0.text

We need to save that as @response, this is what the user will see in the next iteration

9. Fail Route

Let's connect the green output to the previous Text Question, then we'll connect the red output to a new Text Question with an error message, in case the API call fails

Here's what we've put in the fail Text Question:

We've reminded them of the escape words, and have saved the input as @text again in case they want to retry the request, we then connect it back to the Webhook

10. Escape Route

Lastly, we need an escape route, this will be done with Global Keywords

Anytime a user inputs one of these keywords it will escape the loop and go through a different flow

Here we've entered two options, stop the flow and close the chat, or talk to a human

That's it! For troubleshooting the API call the Webhook logs are very useful

Enjoy your AI WhatsApp bot!

How did we do?

How to calculate the number of days between two selected dates (WhatsApp)

Send Automated HSM based on Dates

Contact