Back to Novu

WhatsApp Business Chat Integration with Novu

docs/platform/integrations/chat/whats-app.mdx

3.18.08.7 KB
Original Source
<Note> Check out the [agents](/agents) documentation for more information on how to build agents using WhatsApp. </Note>

Getting Started

To integrate WhatsApp Business with Novu, You will have to create a facebook developer app and obtain the necessary credentials.

<Steps> <Step title="Create a Facebook developer app"> Visit the [Facebook Developer Portal](https://developers.facebook.com/apps/) and create a new app.

Select "Other" for "What do you want your app to do?" and select "Business" for "Select an app type".

</Step> <Step title="Setup WhatsApp product"> On the App Setup page, click on "Set Up" under the "WhatsApp" product. You will need to create or add a Facebook Business Account to your app. </Step> <Step title="Send a sandbox message"> Copy the following pieces and paste them in the Novu WhatsApp Business integration settings:
  • Temporary access token - Access API token field
  • Phone Number ID - Phone number identification field
<Warning> It's important to note that the test credentials for whatsapp cannot be used in production and will expire in 24 hours. You will need to submit your app for review to obtain production credentials. </Warning> </Step> <Step title="Add a test phone number"> You can add a test phone number to the sandbox by clicking on the **"Add Phone Number"** button. This number can be used to test your integration with Novu before submitting for a review. </Step> <Step title="Send a test notification from Novu"> You can now create a new workflow with a "chat" node, and add your content. Save your workflow, and click on **"Trigger Notification"** button.

In the to field, specify the phone number you added in the sandbox, and click on "Send Notification".

json
{
  "subscriberId": "TEST_SUBSCRIBER_ID",
  "phone": "+11111111111"
}

and in the overrides field, add the following:

json
{
  "chat": {
    "template": {
      "name": "hello_world",
      "language": {
        "code": "en_US"
      }
    }
  }
}
<Note> For test credentials you can only used the built in Whats App Template. </Note> </Step> </Steps>

Going to production

<Steps> <Step title="Register a business phone number"> To go live you will need to add a real business phone number and submit your app for review. Follow the [Facebook Instructions](https://developers.facebook.com/docs/whatsapp/cloud-api/get-started/add-a-phone-number) on how to proceed. </Step> <Step title="Generate a permanent access token"> Follow the [Facebook Instructions](https://developers.facebook.com/docs/whatsapp/business-management-api/get-started/) on how to generate a permanent access token. Depending on your use case. </Step> <Step title="Create a WhatsApp template"> You will need to create a WhatsApp Template to send notifications to your customers. Create a template in the [Business Manager](https://business.facebook.com/wa/manage/message-templates) and submit it for review. After your template is approved, you can use the `template_name` to send notifications to your customers.

To send a notification with a template, you will need to add the following to the overrides field:

<Tabs> <Tab title="Node.js"> ```typescript import { Novu } from '@novu/api';

const novu = new Novu({ secretKey: "<NOVU_SECRET_KEY>" });

await novu.trigger({ workflowId: "workflowId", to: { subscriberId: "subscriberId", phone: "+11111111111", }, payload: {}, overrides: { "chat": { "template": { "name": "template_name", "language": { "code": "en_US" } } } }, });

  </Tab>
  <Tab title="Python">
```python
import os
import novu_py
from novu_py import Novu

with Novu(secret_key=os.getenv("NOVU_SECRET_KEY", "")) as novu:
    novu.trigger(trigger_event_request_dto=novu_py.TriggerEventRequestDto(
        workflow_id="workflowId",
        to={"subscriber_id": "subscriberId", "phone": "+11111111111"},
        payload={},
        overrides={
        "chat": {
                "template": {
                        "name": "template_name",
                        "language": {
                                "code": "en_US"
                        }
                }
        }
},
    ))
</Tab> <Tab title="Go"> ```go import ( "context" "os"
novugo "github.com/novuhq/novu-go"
"github.com/novuhq/novu-go/models/components"

)

s := novugo.New(novugo.WithSecurity(os.Getenv("NOVU_SECRET_KEY")))

res, err := s.Trigger(context.Background(), components.TriggerEventRequestDto{ WorkflowID: "workflowId", To: components.CreateToSubscriberPayloadDto(components.SubscriberPayloadDto{ SubscriberID: "subscriberId", Phone: novugo.String("+11111111111"), }), Payload: map[string]any{}, Overrides: map[string]any{ "chat": { "template": { "name": "template_name", "language": { "code": "en_US" } } } }, }, nil)

  </Tab>
  <Tab title="PHP">
```php
use novu;
use novu\Models\Components;

$sdk = novu\Novu::builder()->setSecurity('<NOVU_SECRET_KEY>')->build();

$sdk->trigger(
    triggerEventRequestDto: new Components\TriggerEventRequestDto(
        workflowId: 'workflowId',
        to: new Components\SubscriberPayloadDto(subscriberId: 'subscriberId', phone: '+11111111111'),
        payload: {},
        overrides: {
        "chat": {
                "template": {
                        "name": "template_name",
                        "language": {
                                "code": "en_US"
                        }
                }
        }
},
    ),
);
</Tab> <Tab title=".NET"> ```csharp using Novu; using Novu.Models.Components;

var sdk = new NovuSDK(secretKey: "<NOVU_SECRET_KEY>");

await sdk.TriggerAsync(triggerEventRequestDto: new TriggerEventRequestDto() { WorkflowId = "workflowId", To = To.CreateSubscriberPayloadDto(new SubscriberPayloadDto() { SubscriberId = "subscriberId", Phone = "+11111111111" }), Payload = {}, Overrides = { "chat": { "template": { "name": "template_name", "language": { "code": "en_US" } } } }, });

  </Tab>
  <Tab title="Java">
```java
import co.novu.Novu;
import co.novu.models.components.*;

Novu novu = Novu.builder().secretKey("<NOVU_SECRET_KEY>").build();

novu.trigger()
    .body(TriggerEventRequestDto.builder()
        .workflowId("workflowId")
        .to(To2.of(SubscriberPayloadDto.builder().subscriberId("subscriberId").phone("+11111111111").build()))
        .payload({})
        .overrides({
        "chat": {
                "template": {
                        "name": "template_name",
                        "language": {
                                "code": "en_US"
                        }
                }
        }
})
        .build())
    .call();
</Tab> <Tab title="cURL"> ```bash curl --location 'https://api.novu.co/v1/events/trigger' \ --header 'Content-Type: application/json' \ --header 'Authorization: ApiKey <NOVU_SECRET_KEY>' \ -d '{ "name": "workflowId", "to": { "subscriberId": "subscriberId", "phone": "+11111111111" }, "payload": {}, "overrides": { "chat": { "template": { "name": "template_name", "language": { "code": "en_US" } } } } }' ``` </Tab> </Tabs> </Step> </Steps>

Using WhatsApp with agents

WhatsApp is a supported agent provider. Connect your WhatsApp Business account to an agent so users can message your number and get replies in the same thread — without building Meta webhook handling yourself.

<Card title="Build agents on WhatsApp" icon="bot" href="/agents"> Learn how Novu agents work, including managed and custom code agents. </Card>

What you get

When WhatsApp is connected to an agent:

  • Users message your WhatsApp number and your agent responds in the same chat
  • Conversations appear in the dashboard under Agent Conversations
  • Supported content includes text, markdown, and interactive buttons; inbound media is surfaced via attachments

See agent conversations for capabilities across all providers.

Agent conversations vs. workflow notifications

Use caseWhat happens
Agent conversationThe user messages your WhatsApp number and your agent replies in the same chat.
Workflow notificationYou trigger a workflow with a Chat step and Novu sends a one-way template message to the subscriber.
<Card icon="bot" href="/agents/get-started/agents-and-providers" title="Agents and providers"> Connect WhatsApp and other providers to an agent. </Card>