THE AI SERVER — Chhattisgarh's First AI Studio — 2026
Video · Automation · Web · Education
Tutorials · 2026-05-22

How to Build a WhatsApp Chatbot with AI in 2026 (Step-by-Step)

How to Build a WhatsApp Chatbot with AI in 2026 (Step-by-Step)

WhatsApp has over 2 billion users. In India alone, it's the primary communication tool for businesses and customers. An AI chatbot on WhatsApp means 24/7 customer support, instant responses, and automated lead generation — all on the platform your customers already use.

This guide walks you through building a production-ready AI WhatsApp chatbot from scratch.

What You'll Build

A WhatsApp chatbot that:

  • Responds to customer messages automatically
  • Uses AI (GPT or open-source) to understand and answer questions
  • Handles common queries (pricing, hours, location, FAQs)
  • Escalates to a human when needed
  • Works 24/7 without manual intervention

Prerequisites

  • A Facebook Business account
  • A phone number not already on WhatsApp
  • Node.js installed (v18+)
  • Basic JavaScript knowledge
  • An OpenAI API key (or Ollama for local AI)

Step 1: Set Up WhatsApp Business API

Create a Meta Business Account

  1. Go to business.facebook.com
  2. Create a business account or use an existing one
  3. Verify your business (required for production use)

Set Up WhatsApp Business Platform

  1. Go to the Meta Developer Portal
  2. Click "Create App" → Select "Business" → Name your app
  3. Under "Add Products", select "WhatsApp"
  4. Follow the setup wizard to get a temporary test number

You'll get:

  • Phone Number ID: Used to send messages
  • WhatsApp Business Account ID: Your account identifier
  • Temporary access token: For testing (replace with permanent token later)

Configure a Webhook

Your chatbot needs a URL where WhatsApp can send incoming messages. For local development, use ngrok:


# Install ngrok
npm install -g ngrok

# Start a tunnel to your local server
ngrok http 3000

Copy the HTTPS URL (like https://abc123.ngrok.io) — you'll need it for the webhook setup.

In the Meta Developer Portal:

  1. Go to WhatsApp → Configuration → Webhook
  2. Set the callback URL to https://your-url.ngrok.io/webhook
  3. Set a verify token (any string you choose, like my_verify_token_123)
  4. Subscribe to messages events

Step 2: Create the Node.js Server

Project Setup


mkdir whatsapp-ai-bot
cd whatsapp-ai-bot
npm init -y
npm install express axios openai dotenv

Basic Server Structure

Create .env:


WHATSAPP_TOKEN=your_permanent_access_token
PHONE_NUMBER_ID=your_phone_number_id
VERIFY_TOKEN=your_verify_token
OPENAI_API_KEY=your_openai_key
PORT=3000

Create index.js:


require('dotenv').config();
const express = require('express');
const axios = require('axios');
const OpenAI = require('openai');

const app = express();
app.use(express.json());

const openai = new OpenAI({ apiKey: process.env.OPENAI_API_KEY });

// Store conversation history per user
const conversations = {};

// Webhook verification (GET request from Meta)
app.get('/webhook', (req, res) => {
  const mode = req.query['hub.mode'];
  const token = req.query['hub.verify_token'];
  const challenge = req.query['hub.challenge'];

  if (mode === 'subscribe' && token === process.env.VERIFY_TOKEN) {
    res.status(200).send(challenge);
  } else {
    res.sendStatus(403);
  }
});

// Handle incoming messages (POST request from Meta)
app.post('/webhook', async (req, res) => {
  const body = req.body;

  if (body.object === 'whatsapp_business_account') {
    const entry = body.entry?.[0];
    const changes = entry?.changes?.[0];
    const message = changes?.value?.messages?.[0];

    if (message && message.type === 'text') {
      const userMessage = message.text.body;
      const userPhone = message.from;

      console.log(`Message from ${userPhone}: ${userMessage}`);

      const aiResponse = await getAIResponse(userPhone, userMessage);
      await sendMessage(userPhone, aiResponse);
    }
  }

  res.sendStatus(200);
});

// Send message via WhatsApp API
async function sendMessage(to, text) {
  try {
    await axios.post(
      `https://graph.facebook.com/v18.0/${process.env.PHONE_NUMBER_ID}/messages`,
      {
        messaging_product: 'whatsapp',
        to: to,
        text: { body: text }
      },
      {
        headers: {
          'Authorization': `Bearer ${process.env.WHATSAPP_TOKEN}`,
          'Content-Type': 'application/json'
        }
      }
    );
  } catch (error) {
    console.error('Error sending message:', error.response?.data || error.message);
  }
}

// AI response with conversation memory
async function getAIResponse(userPhone, userMessage) {
  if (!conversations[userPhone]) {
    conversations[userPhone] = [
      {
        role: 'system',
        content: `You are a helpful customer support assistant for a business. 
        Be concise, friendly, and professional. 
        If you don't know something, say so honestly.
        Keep responses under 3 paragraphs.
        The business is based in Raipur, Chhattisgarh, India.`
      }
    ];
  }

  conversations[userPhone].push({ role: 'user', content: userMessage });

  // Keep only last 10 messages to manage token usage
  if (conversations[userPhone].length > 11) {
    conversations[userPhone] = [
      conversations[userPhone][0],
      ...conversations[userPhone].slice(-10)
    ];
  }

  try {
    const completion = await openai.chat.completions.create({
      model: 'gpt-4o-mini',
      messages: conversations[userPhone],
      max_tokens: 500
    });

    const aiReply = completion.choices[0].message.content;
    conversations[userPhone].push({ role: 'assistant', content: aiReply });

    return aiReply;
  } catch (error) {
    console.error('AI Error:', error.message);
    return "I'm having trouble processing your request right now. Please try again in a moment.";
  }
}

app.listen(process.env.PORT, () => {
  console.log(`Server running on port ${process.env.PORT}`);
});

Step 3: Use Local AI Instead of OpenAI (Optional)

If you prefer running AI locally (no API costs, full privacy), replace the OpenAI code with Ollama:


// Replace the OpenAI import and getAIResponse function:

async function getAIResponse(userPhone, userMessage) {
  if (!conversations[userPhone]) {
    conversations[userPhone] = [];
  }

  conversations[userPhone].push(userMessage);

  try {
    const response = await axios.post('http://localhost:11434/api/chat', {
      model: 'llama3.1:8b',
      messages: [
        {
          role: 'system',
          content: 'You are a helpful customer support assistant. Be concise and friendly.'
        },
        ...conversations[userPhone].map(msg => ({
          role: 'user',
          content: msg
        }))
      ],
      stream: false
    });

    const aiReply = response.data.message.content;
    conversations[userPhone].push(aiReply);
    return aiReply;
  } catch (error) {
    console.error('Ollama Error:', error.message);
    return "I'm having trouble right now. Please try again shortly.";
  }
}

Make sure Ollama is running: ollama run llama3.1:8b

Step 4: Add Smart Features

Auto-Escalation to Human

Add logic to detect when a customer needs a human:


const HUMAN_ESCALATION_KEYWORDS = [
  'speak to someone', 'human', 'manager', 'complaint',
  'refund', 'angry', 'frustrated', 'cancel'
];

function needsHumanEscalation(message) {
  const lower = message.toLowerCase();
  return HUMAN_ESCALATION_KEYWORDS.some(keyword => lower.includes(keyword));
}

// In your webhook handler, before calling getAIResponse:
if (needsHumanEscalation(userMessage)) {
  await sendMessage(userPhone, 
    "I understand you'd like to speak with someone. Let me connect you with our team. A human agent will respond shortly."
  );
  // Log for human follow-up
  console.log(`ESCALATION NEEDED: ${userPhone} - "${userMessage}"`);
  return;
}

Interactive Buttons

WhatsApp supports interactive buttons for quick replies:


async function sendButtons(to, bodyText, buttons) {
  await axios.post(
    `https://graph.facebook.com/v18.0/${process.env.PHONE_NUMBER_ID}/messages`,
    {
      messaging_product: 'whatsapp',
      to: to,
      type: 'interactive',
      interactive: {
        type: 'button',
        body: { text: bodyText },
        action: {
          buttons: buttons.map((btn, i) => ({
            type: 'reply',
            reply: { id: `btn_${i}`, title: btn }
          }))
        }
      }
    },
    {
      headers: {
        'Authorization': `Bearer ${process.env.WHATSAPP_TOKEN}`,
        'Content-Type': 'application/json'
      }
    }
  );
}

// Usage:
await sendButtons(userPhone, "How can I help you today?", [
  "View Services", "Get Pricing", "Contact Us"
]);

Business Hours Check


function isWithinBusinessHours() {
  const now = new Date();
  const indiaTime = new Date(now.toLocaleString('en-US', { timeZone: 'Asia/Kolkata' }));
  const hour = indiaTime.getHours();
  const day = indiaTime.getDay();

  // Monday-Saturday, 9 AM - 7 PM IST
  return day >= 1 && day <= 6 && hour >= 9 && hour < 19;
}

// In webhook handler:
if (!isWithinBusinessHours()) {
  await sendMessage(userPhone,
    "Thanks for reaching out! Our business hours are Mon-Sat, 9 AM - 7 PM IST. We'll respond first thing tomorrow."
  );
  return;
}

Step 5: Deploy to Production

Option A: Railway (Easiest)


npm install -g @railway/cli
railway login
railway init
railway up

Set environment variables in the Railway dashboard.

Option B: Render

  1. Push your code to GitHub
  2. Go to render.com
  3. Create a new Web Service
  4. Connect your GitHub repo
  5. Set environment variables
  6. Deploy

Option C: VPS (Your Own Server)


# On your server
git clone your-repo
cd whatsapp-ai-bot
npm install
npm install -g pm2
pm2 start index.js --name whatsapp-bot
pm2 save
pm2 startup

Update your webhook URL in Meta Developer Portal to your server's public URL.

Step 6: Get Permanent Access Token

The temporary token expires. To get a permanent one:

  1. Go to Meta Business Suite → Settings → System Users
  2. Create a system user with "Admin" role
  3. Generate a new token with whatsapp_business_messaging permission
  4. Assign the token to your WhatsApp Business Account

Going Further

Once your basic bot works, consider:

  • Database integration: Store conversations in PostgreSQL or MongoDB for analytics
  • Media handling: Process images, documents, and voice messages
  • Multi-language support: Auto-detect language and respond accordingly
  • CRM integration: Connect to your existing customer management tools
  • Analytics dashboard: Track response times, common queries, customer satisfaction

Need Professional Setup?

Building a WhatsApp chatbot is straightforward, but production deployment requires careful configuration, testing, and ongoing maintenance.


At The AI Server, we build custom WhatsApp AI chatbots for businesses across India. From simple FAQ bots to complex multi-language assistants — we handle the technical setup so you can focus on your customers. Get in touch for a free consultation.

Want More AI Insights Like This?

Join 5,000+ founders and creators getting our weekly AI brief. Free tools, tutorials, and insider strategies — straight to your inbox.

Explore more from THE AI SERVER:

AI Video Production → Business Automation → Book Free Strategy Session →

Related Articles

Tutorials

How to Run AI Models Locally on Your PC in 2026 (No Cloud Required)

Read More →
AI Technology

Complete Guide to AI Agents in 2026: What They Are and How to Build Them

Read More →