---
title: Agente de IA para WhatsApp com Next.js 15 e Zavu
description: Crie um route handler em Next.js para processar webhooks do WhatsApp e delegar respostas a agentes gerenciados pela Zavu.
date: 2025-12-18
author: Jennifer Villalobos
locale: pt
source: https://www.zavu.dev/pt/blog/whatsapp-ai-agents-nextjs
tags: Agentes IA, WhatsApp, Next.js, TypeScript
---

# Agente de IA para WhatsApp com Next.js 15 e Zavu

# Agente de IA para WhatsApp com Next.js 15 e Zavu

Next.js (app router) facilita a construcao de webhooks serverless. Veja como conectar um sender de WhatsApp da Zavu e usar agentes de IA prontos.

## Setup

```bash
npx create-next-app whatsapp-agent
cd whatsapp-agent
bun add @zavudev/sdk
```

Crie `.env.local` com `ZAVUDEV_API_KEY`, `ZAVU_WEBHOOK_SECRET`, `ZAVU_SENDER_ID`.

## Cliente

`app/lib/zavu.ts`:

```typescript
import Zavudev from '@zavudev/sdk'

export const zavu = new Zavu({ apiKey: process.env.ZAVUDEV_API_KEY! })
```

## Route Handler

`app/api/webhooks/whatsapp/route.ts`:

```typescript
import { NextRequest, NextResponse } from 'next/server'
import crypto from 'crypto'
import { zavu } from '@/lib/zavu'

export async function POST(req: NextRequest) {
  const body = await req.text()
  const signature = req.headers.get('x-zavu-signature') || ''
  const digest = crypto
    .createHmac('sha256', process.env.ZAVU_WEBHOOK_SECRET!)
    .update(body)
    .digest('hex')

  if (!crypto.timingSafeEqual(Buffer.from(digest), Buffer.from(signature))) {
    return NextResponse.json({ error: 'invalid signature' }, { status: 401 })
  }

  const event = JSON.parse(body)
  if (event.type === 'message.received') {
    await zavu.senders.agent.reply({
      senderId: process.env.ZAVU_SENDER_ID!,
      contactId: event.data.contact.id,
      messageId: event.data.message.id
    })
  }

  return NextResponse.json({ status: 'ok' })
}
```

Implemente `export const runtime = 'edge'` se quiser rodar no edge.

## Criando o agente

No dashboard selecione seu sender e configure:
- Provider: `zavu`
- Modelo: `gpt-4o-mini`/`claude-3-5-sonnet`
- Prompt: defina tom e limites
- Context window: 6-10 mensagens
- Ferramentas: HTTP para consultar CRM, knowledge base para docs

Ou via codigo:

```typescript
await zavu.senders.agent.create({
  senderId: process.env.ZAVU_SENDER_ID!,
  name: 'Next Support',
  provider: 'zavu',
  model: 'gpt-4o-mini',
  systemPrompt: 'Ajude clientes SaaS em portugues',
  includeContactMetadata: true,
  enabled: true
})
```

## Bases de conhecimento + ferramentas

- `zavu.senders.agent.knowledge_bases.attach` para anexar Notion, Zendesk, Github
- `zavu.senders.agent.tools.create` para endpoints GraphQL/REST

## Observabilidade

- Use Logs do Vercel / Next para ver cada webhook
- Configure webhooks de analytics (agent.executed) para medir latencia
- Use `metadata` para rastrear tickets

## Deploy

1. Deploy no Vercel (set env vars)
2. Ative `Protect Webhook` no dashboard (valida assinatura)
3. Use `vercel env pull` para sincronizar localmente

Seu agente Next.js esta ativo! Para ver casos complexos (roteamento multi-sender, integracao com Salesforce), [agende uma demo](/schedule?service=demo).