Creating an AI ChatBot using WhatsApp -ChatGPT integration with webMethods.io
Tags: chatbot, webmethods, chatgpt, integration
Published: 2023-06-06 12:37:18

---
title: Creating an AI ChatBot using WhatsApp -ChatGPT integration with webMethods.io
published: true
date: 2023-05-30 05:34:05 UTC
tags: chatbot, webmethods, chatgpt, integration
canonical_url: https://tech.forums.softwareag.com/t/creating-an-ai-chatbot-using-whatsapp-chatgpt-integration-with-webmethods-io/279103
---

 

_products versions - {[webMethods.io](http://webMethods.io) Integration 10.16.0.0}_

## Introduction

Creating a chatbot has become increasingly popular as businesses and individuals recognize the immense benefits they offer. A chatbot is an automated conversational agent that interacts with users in a human-like manner, providing information, answering queries, and even executing tasks.

**Benefits include and not limited to :**

- Thanks to the efficiency of ChatGPT, a human mediator can oversee multiple conversations simultaneously. The AI rapidly generates high-quality responses, which the mediator simply has to approve, allowing them to manage numerous threads at once.
- Although the chatbot itself can operate 24/7, the quality of support hinges on the availability of a human mediator to review responses. This ensures customers receive accurate and relevant assistance whenever a human is present to validate the AI’s outputs.
- As you’re already aware Chatbots use Artificial Intelligence and Machine Learning to analyze user behavior and data, which leads to more personalized and precise responses over time. The continuous learning capability of the AI enables it to improve the quality of responses as it interacts with more users.

So, having an AI Powered generative ChatBot can be cost efficient, improves customer satisfaction, provides personalized instant support.

> To enhance the user experience and ensure accurate responses, we advocate for a model that includes a human in the loop. This human mediator serves to review the AI’s output, mitigating any potential “hallucinations” or unintended responses that could be sent to the user.

## Pre-requisites :  

**Create ChatGPT OpenAI account and access to API Keys**

For the purposes of introduction, I just asked ChatGPT to introduce itself and here’s what it had to say

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/6/4/64292096678aa6cd9f0628485f587621bced3855_2_517x338.jpeg)](https://global.discourse-cdn.com/techcommunity/original/3X/6/4/64292096678aa6cd9f0628485f587621bced3855.jpeg "image")

OpenAI, the company behind ChatGPT has exposed the set of APIs to interact with their GPT models and get interesting results.

Software AG was quick enough to create a built-in Connector for ChatGPT in our iPaaS tool [webMethods.io](http://webMethods.io) from which the benefits of ChatGPT can be extended to Hundreds of popular and interesting cloud / SaaS applications and make business processes more intelligent and efficient.

To Create a ChatGPT account, log in to : [https://platform.openai.com/](https://platform.openai.com/) , you will be presented with options to Sign up using Email or Connect using Google, Microsoft or Apple accounts.

Once logged in, on the Top Right-hand corner Click on Personal and in the drop-down Click on View API Keys

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/d/5/d5ddb18480128db2f1834a3bf27082fa3bd3ffd3_2_517x156.png)](https://global.discourse-cdn.com/techcommunity/original/3X/d/5/d5ddb18480128db2f1834a3bf27082fa3bd3ffd3.png "image")

This should help you to create a new API secret Key.

Please note that once the trial is expired, the pricing of the APIs based on the invoked models could be referred at: [OpenAI API](https://platform.openai.com/docs/models/)

**Create a Facebook developer account using** [**https://developers.facebook.com/**](https://developers.facebook.com/)

On this portal, On the Top right-hand corner, click on Login, Create / Sign-in to the Facebook account from which you want to create your business App for which WhatsApp needs to be configured **by clicking on My Apps > Create App Button**

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/c/e/ce0ba6ddc896ef38b9ec1a45c6a0d5d46150fb08_2_517x112.jpeg)](https://global.discourse-cdn.com/techcommunity/original/3X/c/e/ce0ba6ddc896ef38b9ec1a45c6a0d5d46150fb08.jpeg "image")

This should prompt you as below, for our purpose we choose other and click Next. In the next prompt, Select the App Type as Business

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/d/f/df39cea3f7c4b09e076ed25df7fc8ca96510ee57_2_517x109.png)](https://global.discourse-cdn.com/techcommunity/original/3X/d/f/df39cea3f7c4b09e076ed25df7fc8ca96510ee57.png "image")

Choose a relevant App name, Contact Email and tag optionally tag a business account to manage.

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/6/6/666ed4936a38c545b9bf858eaeb9f07419fa57fc_2_517x198.png)](https://global.discourse-cdn.com/techcommunity/original/3X/6/6/666ed4936a38c545b9bf858eaeb9f07419fa57fc.png "image")

On your newly created app screen, scroll down to WhatsApp and click Setup

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/5/2/5291be568ce6d054cdc62b0f9ab75353d8620b9f_2_517x209.png)](https://global.discourse-cdn.com/techcommunity/original/3X/5/2/5291be568ce6d054cdc62b0f9ab75353d8620b9f.png "image")

In the subsequent screens, you can create/select Meta Business Account to manage this App and click continue.

You should now get to a welcome screen as below, Click on Start using API

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/d/7/d7e05ecf7718893413f30daf5dc031cb616f35b3_2_517x135.png)](https://global.discourse-cdn.com/techcommunity/original/3X/d/7/d7e05ecf7718893413f30daf5dc031cb616f35b3.png "image")

You will be assigned a temporary access token, a Test Phone number, and a request example to send a test message using the phone number. You can add the recipient phone number list, by clicking on the dropdown under **To** :

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/8/7/875dd2b998c509a18964bc934dc3957b027d505d_2_517x288.png)](https://global.discourse-cdn.com/techcommunity/original/3X/8/7/875dd2b998c509a18964bc934dc3957b027d505d.png "image")

Now, you will be able to send messages/template messages using the test Facebook number. (_To request permanent access token / use your own phone number, you would need a valid and verified WhatsApp business Account_ [Learn how to create a permanent token](https://developers.facebook.com/docs/whatsapp/business-management-api/using-the-api#1--acquire-an-access-token-using-a-system-user-or-facebook-login)_)_

The next step would be to set up webhooks to listen to whenever an event occurs on your WhatsApp number. We shall come back to this and configure this at a later point in time after setting up the **webhooks using [webMethods.io](http://webMethods.io)**

**Create/use your [webMethods.io](http://webMethods.io) to set up the WhatsApp ChatGPT integration.**

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/9/e/9e72378666f2215826eb4ccedd508a5151b5e4ea_2_517x173.png)](https://global.discourse-cdn.com/techcommunity/original/3X/9/e/9e72378666f2215826eb4ccedd508a5151b5e4ea.png "image")

If you don’t already have a [webMethods.io](http://webMethods.io) account, a free trial / Forever Free Edition can be requested using [https://softwareag.cloud/](https://softwareag.cloud/)

Tutorials and documentation for [webMethods.io](http://webMethods.io) Integration can be accessed at [https://docs.webmethods.io/](https://docs.webmethods.io/)

## **Steps to Build Your Chatbot! :**

If you’ve reached this point, the assumption is, you’ve already completed the pre-requisites and fairly understand using [webMethods.io](http://webMethods.io). If not, please refer to the Tutorials from the above link.

1. Log in to your [webMethods.io](http://webMethods.io) Integration and create a project and workflow with suitable name. By Clicking on the “+” icon once on the projects and once for the workflows screen

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/d/5/d56ec9e86deed17ba1cd3e571540fda0cf5d4264_2_517x225.png)](https://global.discourse-cdn.com/techcommunity/original/3X/d/5/d56ec9e86deed17ba1cd3e571540fda0cf5d4264.png "image")

2.Create a new workflow from the scratch, click on the settings on top of the Start Action to configure this as a webhook

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/0/f/0f2bc8b1887f31eea98dc987ce59799a3fb4c243_2_517x181.png)](https://global.discourse-cdn.com/techcommunity/original/3X/0/f/0f2bc8b1887f31eea98dc987ce59799a3fb4c243.png "image")

Once you’ve selected the webhook from the list of triggers, you should now have a test URL to send in the headers and body for our request which should be used to configure our subsequent workflow steps

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/5/5/558be1c563d3224fb011551b2675c490ae61c522_2_517x315.png)](https://global.discourse-cdn.com/techcommunity/original/3X/5/5/558be1c563d3224fb011551b2675c490ae61c522.png "image")

3.Use SoapUI / Postman or any 3rd Party webservice testing tool and send in the test data. Note: The message templates are readily available on the postman portal and can be forked and modified according to our needs from the link : [Postman](https://www.postman.com/meta/workspace/whatsapp-business-platform/request/)

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/8/d/8d4bf754e6f05541ad5836b6226af69d363f407a_2_517x240.png)](https://global.discourse-cdn.com/techcommunity/original/3X/8/d/8d4bf754e6f05541ad5836b6226af69d363f407a.png "image")

4.Once you’ve fetched the test data into the webhook, this should give you the updated webhook URL with test Headers, Body, and Query parameters. Click Done

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/8/6/8642242393d439904cccd8aedba8923630479ab0_2_471x375.png)](https://global.discourse-cdn.com/techcommunity/original/3X/8/6/8642242393d439904cccd8aedba8923630479ab0.png "image")

5.The next step would be to Configure the webhooks. So, get back to your facebook developer App page from Pre-requisites and click Configure webhooks.

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/f/a/fa44c4e3abb6c9be112038b4a17f69b8b4760768_2_517x68.png)](https://global.discourse-cdn.com/techcommunity/original/3X/f/a/fa44c4e3abb6c9be112038b4a17f69b8b4760768.png "image")

6.On the next screen, click Edit and enter the webhook URL obtained from your [webMethods.io](http://webMethods.io) workflow. Verify Token, can be a token of your choice to validate the webhook. (Before Clicking Verify and Save, Read on to the next point)

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/b/2/b21b4a35904ebad8bfbb27f762f3f0706cfc49aa_2_517x159.png)](https://global.discourse-cdn.com/techcommunity/original/3X/b/2/b21b4a35904ebad8bfbb27f762f3f0706cfc49aa.png "image")

7.To Verify the webhook actually belongs to your portal, Meta API expects you to validate few things which can be found in ([how to configure Webhooks](https://developers.facebook.com/docs/whatsapp/getting-started/signing-up/#configure-webhooks).)

A webhook request from Meta API would look like below:

![image](https://global.discourse-cdn.com/techcommunity/original/3X/2/6/26e00d7d166cbebaa5c2a16f5fe454d9045139a3.png)

So, our workflow should receive the above 3 parameters for which we should put a condition that hub.mode matches subscribe and hub.token matches the token configured by us at the time of configuring workflow in meta API portal  
  
8.So using the Switch connector, the case 1, should look like below

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/d/3/d3adf5429dd33376f1d2b645c0b3ea82a7d9c82d_2_517x150.png)](https://global.discourse-cdn.com/techcommunity/original/3X/d/3/d3adf5429dd33376f1d2b645c0b3ea82a7d9c82d.png "image")
  

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/d/e/de4981a2c1ff0ea469e5132dfecabd3f576acb8f_2_449x375.png)](https://global.discourse-cdn.com/techcommunity/original/3X/d/e/de4981a2c1ff0ea469e5132dfecabd3f576acb8f.png "image")
  
\*In the above ss, hubverifytoken has already been set as project parameter

9.When this condition is true, in the return data to webhook step, we would need to send back the http 200 code along with challenge parameter back. After configuring this we comeback to our meta API portal and click Verify and Save Button, which should actually get accepted.

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/3/9/39758dd58334e330e042f2d925a08cbfaf043360_2_517x165.png)](https://global.discourse-cdn.com/techcommunity/original/3X/3/9/39758dd58334e330e042f2d925a08cbfaf043360.png "image")

10.Next step is to subscribe to message, this can be done in meta App portal menu on the left hand side by clicking on webhooks

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/2/a/2a7ceedf0d619ec94ee6972eb6d13a546bc9bb9e_2_133x250.png)](https://global.discourse-cdn.com/techcommunity/original/3X/2/a/2a7ceedf0d619ec94ee6972eb6d13a546bc9bb9e.png "image")

11.Click on the Subscribe button on messages. This should now notify our workflow for any incoming messages / statuses of the message

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/f/c/fc311781e26511771ec716c240d968b5cf6d168c_2_517x101.png)](https://global.discourse-cdn.com/techcommunity/original/3X/f/c/fc311781e26511771ec716c240d968b5cf6d168c.png "image")

12.Our next step would be to invoke the ChatGPT, So, create a new workflow, this would enable us reusability of the code for further ChatGPT use cases. On the search box type in ChatGPT which should help you filter out the built-in webMethods ChatGPT connector. Drag and Drop it in the workflow and click on settings

![image](https://global.discourse-cdn.com/techcommunity/original/3X/e/e/eebf6fb48c3ad510f46dea386481f227db7109eb.png) ![image](https://global.discourse-cdn.com/techcommunity/original/3X/1/2/12d3fa0e7ff1739efbf06b099c0907d9b8fbc931.png)

13.From the Dropdown, select Create completions, click + next to the Connect to ChatGPT to create a connection to ChatGPT. Here, you would need to enter the API Key (steps for which have been performed in pre-requisites)

![image](https://global.discourse-cdn.com/techcommunity/original/3X/0/5/05fe7bac943d3fcc52d131ace4aefb96bf447124.png)

14.In the Action Configure map the input query received from WhatsApp, choose GPT model, temperature and max tokens to be used for this request as below

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/0/d/0db4efcc32dc13c2aaa58302fd8e1fce7d2083d4_2_517x225.png)](https://global.discourse-cdn.com/techcommunity/original/3X/0/d/0db4efcc32dc13c2aaa58302fd8e1fce7d2083d4.png "image")

Different models available, the tokens it costs to invoke the model and the pricing can be referred in the link : [OpenAI API](https://platform.openai.com/docs/models/)

15.The next step would be to moderate and send the response back to the WhatsApp using REST connector / HTTP Call. (If you need help in Creating a rest connector / HTTP call refer to the [webMethods.io](http://webMethods.io) tutorials.) If not, Drag and drop the connector onto the canvas and click setting to configure.

Our HTTP Connector is configure as below:

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/f/a/fab73433c25390e91608cb5c917dd2176d28877f_2_345x106.png)](https://global.discourse-cdn.com/techcommunity/original/3X/f/a/fab73433c25390e91608cb5c917dd2176d28877f.png "image")

\*This URL can be accessed from our test message in Meta API Portal

Below is the headers that are being passed:

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/f/c/fc51bc5a09c6a1323c63bf82a96baa9d91200628_2_345x193.png)](https://global.discourse-cdn.com/techcommunity/original/3X/f/c/fc51bc5a09c6a1323c63bf82a96baa9d91200628.png "image")

\*The token is currently configured as project parameters which can be obtained as defined in Pre-Requisites

Body is being configured as below by taking the ChatGPT output

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/5/3/539c26615872b8c1a7571384da69f530b2ffebe6_2_517x125.png)](https://global.discourse-cdn.com/techcommunity/original/3X/5/3/539c26615872b8c1a7571384da69f530b2ffebe6.png "image")

16.Finally, return the http 200 indicating the success back to Meta API. Also ensure necessary Http codes are sent back to the meta API for all the necessary cases or else there is a chance of the messages being repeatedly queued until a response is got and thereby flooding the requests into [webMethods.io](http://webMethods.io), chatGPT and WhatsApp.  
a. Also, as a step to make humans accountable on all decisions, output from ChatGPT, Microsoft To Do connector is being used to create a task for manual approval.

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/b/3/b31fb7ad684934de75a0e453a074eec01d4b88b9_2_345x192.png)](https://global.discourse-cdn.com/techcommunity/original/3X/b/3/b31fb7ad684934de75a0e453a074eec01d4b88b9.png "image")

17.A new workflow, will get triggered on marked completion / approval of the task, which would send the messages back to the user.

The Final, workflow should look something like this:

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/f/7/f7f352d39a9fad0b825cf671592fb2f6e3073327_2_517x329.jpeg)](https://global.discourse-cdn.com/techcommunity/original/3X/f/7/f7f352d39a9fad0b825cf671592fb2f6e3073327.jpeg "image")
  

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/d/2/d2da6b9950ff660d7794baf361d1f39d16301f20_2_517x209.png)](https://global.discourse-cdn.com/techcommunity/original/3X/d/2/d2da6b9950ff660d7794baf361d1f39d16301f20.png "image")
  

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/7/e/7e0cdc90a26c6ce358c0cbc2532c4344a829bf76_2_517x177.png)](https://global.discourse-cdn.com/techcommunity/original/3X/7/e/7e0cdc90a26c6ce358c0cbc2532c4344a829bf76.png "image")

18.Now, we’ve come to the sweet part of testing our Chat Bot and here’s what our query and response messages look like:

[![image](https://global.discourse-cdn.com/techcommunity/optimized/3X/6/5/6555e0c49b4d99bda98f1b14f9eca6b2ebee94f7_2_517x373.jpeg)](https://global.discourse-cdn.com/techcommunity/original/3X/6/5/6555e0c49b4d99bda98f1b14f9eca6b2ebee94f7.jpeg "image")

## Useful links | Relevant resources

**ChatGPT Documentationion** : [OpenAI API](https://platform.openai.com/docs/introduction)  
**Whatsapp Cloud API Documentation** : [Cloud API - Documentation - Meta for Developers](https://developers.facebook.com/docs/whatsapp/cloud-api/)  
**Facebook Developers Portal** : [**https://developers.facebook.com/**](https://developers.facebook.com/)  
**Create Permanent WhatsappToken** : [Learn how to create a permanent token](https://developers.facebook.com/docs/whatsapp/business-management-api/using-the-api#1--acquire-an-access-token-using-a-system-user-or-facebook-login)  
**Signup/Request free Software AG Cloud trial** : [https://softwareag.cloud/](https://softwareag.cloud/)  
[webmethods.io](http://webmethods.io) documentation : [https://docs.webmethods.io/](https://docs.webmethods.io/)

[Read full topic](https://tech.forums.softwareag.com/t/creating-an-ai-chatbot-using-whatsapp-chatgpt-integration-with-webmethods-io/279103)