Introduction to WhatsApp Chatbot Development

Creating a WhatsApp chatbot using Node.js and the WaSenderAPI can transform your customer service and marketing strategy. By integrating with the WaSenderAPI, you can send automated messages, handle customer inquiries, and manage real-time interactions through WhatsApp. In this tutorial, we’ll guide you step by step on how to set up a webhook for WhatsApp events and use the WaSenderAPI to send and receive WhatsApp messages with Node.js.

WhatsApp chatbots are ideal for businesses looking to engage with customers instantly. With easy automation, you can offer 24/7 support, send order updates, or even process payments directly via WhatsApp. Let’s dive into the setup process to get you started.

Webhook Setup for WhatsApp Events

In order to receive real-time notifications about WhatsApp events, you need to configure a webhook in your WhatsApp session settings. This webhook will allow you to receive updates and events such as message delivery status, session updates, and incoming messages. Configuring your webhook properly is crucial to ensure seamless interaction with the WaSenderAPI.

Enable Webhooks in WhatsApp Session Settings

Head to your WhatsApp session settings and enable webhooks. Specify your webhook endpoint URL in the settings so that your server can listen for incoming events. Don’t forget to securely store your webhook secret, which will be used for verifying the authenticity of the webhook requests. This is an important security measure to ensure the requests are from WaSenderAPI.

For an optimal setup, consider using an encrypted connection (HTTPS) for added security when receiving webhook requests from WaSenderAPI.

Common Webhook Events from WhatsApp

Once your webhook is set up, you will start receiving a variety of events related to your WhatsApp chatbot’s activity. These events include:

• message.sent - Triggered when a message is successfully sent to the recipient.
• session.status - Notifies you about changes in session status, such as active, pending, or expired.
• messages.upsert - Triggered when a new message is received, or an existing message is updated in the system.
• message.failed - Occurs when there’s an error sending a message, useful for handling delivery failures.
• delivery.received - Indicates that the sent message has been successfully delivered to the recipient’s device.

These events allow you to track the status of messages, manage interactions, and maintain real-time communication with your customers.

Webhook Example in Node.js

Below is an example of how to implement a webhook server using Node.js and Express.js to handle incoming webhook events from WaSenderAPI. The server listens for HTTP POST requests and processes various WhatsApp events.

const express = require('express');
const crypto = require('crypto');
const app = express();

app.use(express.json());

// Function to verify webhook signature to ensure it's from WaSenderAPI
function verifySignature(req) {
  const signature = req.headers['x-webhook-signature'];
  const webhookSecret = 'YOUR_WEBHOOK_SECRET'; // Securely store this in environment variables
  if (!signature || !webhookSecret) return false;
  if(signature !== webhookSecret) return false;
  return true;
}

// Webhook endpoint for processing events
app.post('/webhook', (req, res) => {
  // Verify if the request is from WaSenderAPI
  if (!verifySignature(req)) {
    return res.status(401).json({ error: 'Invalid signature' });
  }

  // Process the webhook event
  const event = req.body;
  console.log('Received webhook event:', event.type);

  // Handle different event types and actions
  switch(event.type) {
    case 'message.sent':
      console.log('Message sent:', event.data.id);
      break;
    case 'session.status':
      console.log('Session status changed to:', event.data.status);
      break;
    case 'messages.upsert':
      console.log('New message received:', event.data.key.id);
      break;
    // Add additional event cases as needed
  }

  // Respond with a 200 OK status to acknowledge receipt
  res.status(200).json({ received: true });
});

app.listen(3000, () => {
  console.log('Webhook server is running on port 3000');
});
        

In this code, we’re verifying the authenticity of each incoming request using the signature header. This prevents unauthorized sources from triggering webhook events.

Webhook Headers - How to Verify the Signature

WasenderAPI includes important headers with each webhook request, which you should verify to ensure the authenticity of the incoming requests. The X-Webhook-Signature header is crucial for securing the webhook and preventing unauthorized access. Here’s a quick breakdown:

• X-Webhook-Signature - A secure HMAC SHA-256 signature of the request body. It ensures the data is from a trusted source.

Make sure to compare this signature with your expected signature to verify the integrity and authenticity of the request.

Sending WhatsApp Messages via WaSenderAPI

To interact with your customers, you can send WhatsApp messages using WaSenderAPI’s send-message endpoint. Here’s an example of how to send a text message with an optional media attachment:

import axios from 'axios';

const apiKey = 'your_api_key_here';

// Example of sending a text message with an image attachment
const response = await axios.post(
    'https://wasenderapi.com/api/send-message',
    {
        to: '1234567890', // Recipient phone number
        text: 'Hello from your WhatsApp chatbot!',
        imageUrl: 'https://example.com/images/sample-image.png'
    },
    {
        headers: {
            Authorization: Bearer ${apiKey}
        }
    }
);
        

In the code above, you can send both text and media, such as images, videos, or documents, by providing their URLs. Customize the message content based on your customer’s request or interactions.