Skip to main content

Whatsapp Integration

Ngrok Setup​

Follow the steps explained in Ngrok Setup. When you specify 'Messaging Endpoint' in the 'Whatsapp' resource you will use the <NGROK https end-point>/whatsapp/webhook

Account setup​

Create whatsapp developers account​

  • developers.facebook.com: Create a WhatsApp Developers Account by visiting the provided link. This account will enable you to access the necessary tools and resources for integrating WhatsApp into your application.

Generating WhatsApp Access Token​

  • Create a WhatsApp Business App at developers.facebook.com/apps/create/.

  • Go to business settings - business.facebook.com/settings.

  • Navigate to Users – System Users.

    img alt

  • Add a System User with system user role as Admin.

    img alt

  • After adding System user go to Add Assets.

  • Select Apps -> Your WhatsApp Business App -> Enable Manage App and save.

  • Click on Generate new Token -> Select your App -> Enable whatsapp_business_management and whatsapp_business_messaging and generate the Token. This is your WhatsApp Access Token.

Getting WhatsApp Phone Number ID​

  • Access Getting Started Page: Visit developers.facebook.com/apps/ and navigate to the getting started page.

  • Find Phone Number ID: Look for your phone number ID as displayed on the getting started page. This ID is unique to the phone number associated with your WhatsApp business account. You will find your phone number id as shown in image below

    img alt

  • Adding Phone Numbers: For trial accounts, you can add up to 5 phone numbers that your WhatsApp account can have conversations with.

  • Testing: After adding a phone number, send a test template message to the number to confirm its functionality.

Getting WhatsApp App Secret​

  • Access App Settings: Go to your app settings at developers.facebook.com/apps/.

  • Navigate to Settings/Basic: Within the app settings, navigate to the Settings/Basic section.

  • Reveal App Secret: Click "Show" for App Secret to reveal it. This App Secret will be used as your WA_APP_SECRET.

    img alt

Configuring Webhook​

  • Access WhatsApp Configuration: Go to WhatsApp – Configuration section. img alt
  • Adding Webhook: Add the webhook to your chatbot webservice. Ensure that you have a publicly accessible URL for this purpose. You can refer ngrok setup mentioned above.
  • Setting Callback URL: Set the callback URL as <ngrok url>/whatsapp/webhook.
  • Setting Verify Token: Set the Verify Token as WA_VERIFY_TOKEN.
  • Subscribe to Messages Events: After configuring the webhook, subscribe to the messages events by clicking on "Manage" next to webhook fields and enabling the messages event.

Deployment & Testing​

  • Login into your ac2 account.

  • Click on your project

  • Navigate to provisioning & deploy

    • Once you have enabled the WhatsApp option, you need to input the following credentials,

      • WA_ACCESS_TOKEN: WhatsApp Access Token generated during setup.
      • WA_PHONE_NUMBER_ID: Unique ID for your WhatsApp business account's phone number.
      • WA_VERIFY_TOKEN: (Optional) Verification token for added security (default is often "secret").
      • WA_SERVICE_URL: http://localhost:3978/whatsapp
      • WA_APP_SECRET: WhatsApp App Secret obtained from your app settings.
      • WA_API_URL: https://graph.facebook.com/v19.0
    img alt

Thoroughly test WhatsApp integration within your application to ensure all functionalities are working as expected.

By following these steps, you can ensure successful integration with WhatsApp services.