How to Integrate ChatGPT to WhatsApp
Tags: ai, chatgpt, javascript, machinelearning
Published: 2023-02-02 14:36:20

How to Integrate ChatGPT to WhatsApp
Integrating ChatGPT to WhatsApp is a fancy way to get responses on the go without having to log into ChatGPT website 

This tutorial will integrate ChatGpt to WhatsApp using ChatGPT API and the Cognigy platform. 

To get started with this tutorial, we must have the following. 


- [Facebook Developer Account](https://developers.facebook.com/) 
- [Cognigy Account](https://trial.cognigy.ai/) 
- OpenAI Secret Key 
- Whatsapp Number


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675342006782_Screenshot+2023-02-01+at+5.54.08+AM.png)


First, create a [Cognigy account](https://trial.cognigy.ai/). 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675331938580_Screenshot+2023-02-01+at+5.55.32+AM.png)


After creating an account, click on create agent; this would create a chat agent. 

![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675332194706_Screenshot+2023-02-01+at+6.06.31+AM.png)


Next, fill in the details, and input our Virtual agent name and language; after filling in, click on create an empty agent. 

![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675332334081_Screenshot+2023-02-01+at+6.08.06+AM.png)


This would open a panel, and by the left-hand side of our dashboard, click on flow to create a new conversation flow for our virtual agent. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675332463521_Screenshot+2023-02-01+at+6.09.48+AM.png)


Create a new flow, give it a name, and click save. 

![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675332507741_Screenshot+2023-02-01+at+6.13.06+AM.png)


Once the flow panel opens, we will see a start and end chart. Take our cursor to the middle of the plus icon and click on it. 

![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675332605339_Screenshot+2023-02-01+at+6.13.39+AM.png)


Once the plus icon is clicked, it will open this panel for us to pick a command; here, I will pick a `say command` to allow our agent to greet the user when it is triggered. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675333064135_Screenshot+2023-02-01+at+6.13.59+AM.png)


Edit the Node and ensure the output type is text; the text could be whatever we want. I wrote `Welcome to Scofield-Bot`. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675336574988_Screenshot+2023-02-02+at+12.06.57+PM.png)


Next, let us create another prompt called the question; here, we allow the user to ask questions. 

The question is `text` and write a text “Ask Scofield-Bot anything?


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675333251533_Screenshot+2023-02-01+at+6.22.34+AM.png)


Next, we must integrate the OpenAi extension from our dashboard and go to Dashboard- Manage- Extensions. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675333337640_Screenshot+2023-02-01+at+6.23.18+AM.png)


Look out for OpenAI and click on it. 

![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675333371330_Screenshot+2023-02-01+at+6.23.49+AM.png)


 Install it and update it if we wish, but it is not compulsory. 
 

![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675333485873_Screenshot+2023-02-01+at+6.24.59+AM.png)


 Once done, click on the plus icon after, `say`, and click on extensions; we will see the OpenAi extension icon. Click on it to integrate it into our agent. 
 

![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675333619352_Screenshot+2023-02-01+at+6.25.27+AM.png)


 
We have our OpenAI showing here, and we have to generate text, but first, we must call the OpenAI API to our flow. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675333729734_Screenshot+2023-02-01+at+6.29.43+AM.png)


Once we click on the Generate Text OpenAI prompt, it would ask us for the OpenAI connections, which we do not have yet. Click on this link to generate our [key](https://platform.openai.com/account/api-keys).

![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675333689960_Screenshot+2023-02-01+at+6.28.31+AM.png)


Generate a new secret key, copy it, and store it on a notepad, as we will be using it soon. 

![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675334349715_Screenshot+2023-02-01+at+6.29.43+AM.png)



![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675334489259_Screenshot+2023-02-02+at+11.40.59+AM.png)


Click on the plus button by the side of OpenAI connections, paste the key we created on the OpenAi connection, and give it a name. 

Click on create when done. 

Now we can interact with OpenAI from the Cognigy dashboard, which is half of what we set out to achieve; next, we need to set the prompt to take instructions and give output. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675335529162_Screenshot+2023-02-01+at+6.57.06+AM.png)


Click on the OpenAI prompt and type the command `{{context-result}}; this` allows us to take the result from the question asked and pass it to the OpenAI, which would give us an answer.


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675336923519_Screenshot+2023-02-02+at+12.21.09+PM.png)


Next, test our bot by clicking on the chat icon at the top and see the result. 

If we get answers to our questions asked, then it works correctly. 


####Integrating WhatsApp


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675337069266_Screenshot+2023-02-01+at+6.59.45+AM.png)


To integrate WhatsApp, go to our dashboard by the left and click on Deploy, look through the drop-down and click on Endpoint. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675337132771_Screenshot+2023-02-01+at+7.00.24+AM.png)


Click on the new Endpoint, give our end point a name, and click on the flow, pick the flow from the drop-down and pick WhatsApp as our integration point. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675337235585_Screenshot+2023-02-01+at+7.03.17+AM.png)


Next, click on WhatsApp set up by the right and we will be asked to fill this up. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675337355688_Screenshot+2023-02-01+at+7.07.31+AM.png)


Here we would need to create an API, open a new tab and click on this link to create one. 

Click on My Apps


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675337416565_Screenshot+2023-02-01+at+7.08.32+AM.png)


Click on create App. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675337486274_Screenshot+2023-02-01+at+7.09.03+AM.png)


Select Business and then create. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675337524758_Screenshot+2023-02-01+at+7.10.25+AM.png)


Select Whatsapp. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675337559316_Screenshot+2023-02-01+at+7.16.32+AM.png)


Once setup is complete, our dashboard will have the keys we need for the next step. Due to Facebook policy, we will be issued a temporary key that lasts for 24hrs before expiring, but if we want to learn how to get a permanent key, comment below. 

Copy our ID, temporary access token, and phone number ID, do not use WhatsApp business Id as we will not get any messages. 

Verify token is any password of our choice.


![User-uploaded image: Screenshot+2023-02-01+at+7.03.17+AM.png](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675337235585_Screenshot+2023-02-01+at+7.03.17+AM.png)


Paste the IDs correctly and then check the  


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675340598773_Screenshot+2023-02-01+at+7.24.56+AM.png)


Next is to create a webhook; to get our endpoint URL, go back to our Cognigy dashboard. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675341015795_Screenshot+2023-02-01+at+7.27.21+AM.png)


Go to Endpoint, and we will find our configuration information, copy the URL and paste it on the callback URL. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675341133941_Screenshot+2023-02-01+at+7.28.25+AM.png)


Test our bot by sending a message to our number here. If we follow the step, we will get a message. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675341375594_Screenshot+2023-02-01+at+7.29.58+AM.png)


Once we get this message, our bot is set. 


![](https://paper-attachments.dropboxusercontent.com/s_A40AA4699F520D890639DBEEB45CAD323DEFA86D627E8D6BEC86CAB319345B6B_1675341427361_Screenshot+2023-02-01+at+7.48.59+AM.png)


Send a follow-up message, and we will be interacting with ChatGPT on our phone. 


####Conclusion 

In this tutorial, we learned how to use Cognigy platform to set up ChatGPT and Whatsapp. 

I hope we found this educative. If we want to learn more about integrating ChatGPT with Facebook Messager or Telegram, drop a comment below. 

Read more insightful article [here](blog.learnhub.africa).