What is Facebook Business API:
WhatsApp for Business is part of the Facebook Business API ecosystem. To integrate WhatsApp with MuleSoft, you’ll first need to create a WhatsApp Business Account and set up the necessary configurations on the Facebook Business Manager platform.
Create a Facebook Business Account:
Create a Facebook Business Account If you don’t have one already, create a Facebook Business Account on developers.facebook.com. This will be used to access the WhatsApp Business API.
Step 1: Open your web browser and navigate to developers.facebook.com Click on login
Step 2: Log in to Facebook.
Step 3: click on the ‘My Apps’ option in the top navigation menu.
Step 4: On the ‘My Apps’ page, you will find a button or option to create a new app. Click on it.
Step 5: In the process of creating a new app, you will be asked to select an ‘App Type.’ Choose Business’ as the app type and Click on ‘Next’
Step 6: Select an app type and Click on ‘Next’
Step 7: Follow the prompts to provide the necessary information about your business and the app you are creating. This information may include your business name, website, email address, and other relevant details. Click on ‘Create app’
Step 8: Add products to your app select Whatsapp and Click on ‘setup’
Step 9: Click on Continue
Step10: After clicking Continue, Scroll down the page click on WhatsApp and Click on API Setup
Step 11: Next, Scroll down the page and Click Add a phone number
Step 12: Now Create a WhatsApp Business profile (This profile will show information about your business to people on WhatsApp) fill in the details and Click on Next
Step 13: Next page Add a phone number for WhatsApp, Enter your number Click On Next
Step 14: Now your phone Number has been added to your Whatsapp business account and get the temporary access token This token will expire in 23 hours you can use it to send and receive messages through the WhatsApp Business API.
Create Keystore :
Follow these steps to generate a keystore and export a self-signed certificate
Step 1: open a command prompt windows +r, Enter the CMD, and click OK
Step 2: Open a command prompt in the same directory as Java keytool; alternatively, you may specify the full path of keytool in your command. Pay close attention to the alias you specify in this command as it will be needed later on (Ex: keytool -genkey -alias dwinsoft -keyalg RSA -keystore KeyStore.jks -keysize 2048)
Step 3: Enter a password for the keystore with at least 6 characters
Step 4: Respond to prompts to enter other values. Enter your desired values. The following output shows example responses
Step 5: Confirm or reject the details by typing “Yes” or “No” and press Enter
Step 6: Press Enter to use the same password as the keystore, alternatively specify a separate password and press enter
Now KeyStore.jks created successfully.
Create a New Mule Project
Open Anypoint Studio. Click on “File” > “New” > “Mule Project.” Enter a project name and click “Finish.”
Configuring the TLS Certificate
Step 1: Open the global element to Click Create.
Step 2: Next, search the TLS Context, Select TLS Click Ok
Step 3: Next! scroll down page Key Store Configuration
Step 4: Select the type JKS, Enter the Path name.jks, and enter the password and Click ok .
Step 5: The KeyStore.jks is placed in the src/main/resources.
Your endpoint must be able to process two types of HTTPS requests Configure webhooks to receive messages and Send Messages.
Configure webhooks to receive messages( GET Method)
GET method receives messages from WhatsApp and responds correctly with the challenge value when needed for webhook verification.
HTTP Listener:
Drag and drop an “HTTP Listener”, Double-click on the “HTTP Listener” component to configure its properties. Set the “Path” field to the endpoint path ( “/webhook”). HTTP Listener Config, the port is specified as 8082, and the protocol is selected as HTTPS
Next step Select the TLS Change the Global reference and config the TLS_context NextClick OK
Next, in the ‘Advanced’ section of the HTTP Listener Configuration, select ‘GET’ as the allowed method.
Transform Message
Drag and drop the “Transform Message” component. Double-click on the “Transform Message” component to open and set up the transformation script to process the incoming request. The script is written in DataWeave 2.0 and performs the following tasks Copy to past the Transform Message
( %dw 2.0
output text/plain
var mode = attributes.queryParams.” hub.mode”
var token = attributes.queryParams.” hub.verify_token”
var challenge = attributes.queryParams.” hub.challenge”
var verify_token = “Dwinsoft”
—
if ((!(mode==”) and !(token==”)) and
((mode == “subscribe”) and (token == verify_token)) )
challenge as String
else 404)
Send Message (POST Method):
POST flow to handle event notifications, which will contain user messages or other relevant data from WhatsApp. If you need assistance with those steps or have more questions, please let me know.
HTTP Listener:
Drag and drop an “HTTP Listener”, Double-click on the “HTTP Listener” component to configure its properties. Set the “Path” field to the endpoint path ( “/webhook”). HTTP Listener Config, the port is specified as 8082, and the protocol is selected as HTTPS
Next step Select the TLS Change the Global reference and config the TLS_context Next Click ok.
Next, in the ‘Advanced’ section of the HTTP Listener Configuration, select ‘POST’ as the allowed method.
Transform Message
Drag and drop the “Transform Message” component. Double-click on the “Transform Message” component to open and set up the transformation script to process. The script is written in DataWeave 2.0 and performs the following tasks
Next Open the Developer Account – Dashboard App developers.facebook.com copy the command in the window and Temporary access token
HTTP Request Configuration:
Step 1: Drag and drop the “HTTP Request” component. Double-click on the “HTTP Request” component to open Click to Edit, Open The Configuration element scroll down the connection. Now enter the host and protocol paste Command and Temporary access token
Step 2: Open Settings, in the default headers, select Edit inline from the drop-down option
Step 3: Next configure the temporary token and Click on Finish .
Step 4: Next give the POST method and Enter the Path
Completed the configuration successfuly
Run Your Project
- In Anypoint Studio, right-click on the project (the main area of your Mule Flow) where you’ve designed your integration.
- From the context menu, select “Run Project” to deploy and run your Mule application.
Deploy an Application to Runtime Manager:
Step 1: Sign in to Anypoint Platform.
Step 2: Select Runtime Manager.
Step 3: On the Applications page, click Deploy application. You see the Deploy Application page. the Choose file menu, and the Deploy Application button on the Deploy Application page.
Step 4: Enter the application name, select the application jar file, select CloudHub, and Click on Deploy Application
Step 5: After successfully deploying the Application you get the App URL Copy that URL
Configure webhooks to receive messages
Open the Developer Account – Dashboard App developers.facebook.com
Step 1: Click Step 3 Configure webhooks to receive messages. Configure webhooks.
Step 2: After opening the Configure webhooks to receive messages open the webhook config page. Edit the Callback URL and Verify token
Step 3: In the Edit page paste the URL obtained from Runtime Manager and give the Verify token as specified in the transform message. Click verify and save.
Step 5: click on Webhook fields manage. Subscribe to all Fields and click on Done
Whatsapp Send messages and receive messages
Now Open the Whatsapp message Click on Chatbox Send the message from registered mobile number
Runtime Manager log page:
You can see the Whatsapp incoming messages in the Runtime Manager log
