tutoriais

📲 Tutorial PixBugTech | Como Integrar WhatsApp ao seu Chatbot com Node.js (Sem API paga, sem choro)

📲 Tutorial PixBugTech | Como Integrar WhatsApp ao seu Chatbot com Node.js (Sem API paga, sem choro)

🧠 TAG DA MANCHETE: Seu WhatsApp virou robô? Parabéns, você finalmente fez algo útil com ele.

📸 Imagem Principal Sugerida: Um robô franzino, com tela de QR Code no peito, digitando mensagens freneticamente num WhatsApp verde brilhante, enquanto um desenvolvedor observa com cara de “meu deus, tá funcionando”.

☕ Introdução: A Era do Zap que Trabalha por Você

Sabe aquele monte de gente pagando caríssimo por API do WhatsApp pra fazer o básico? Pois é, trouxas. Com um pouco de Node.js, uma pitada de SQLite e um empurrãozinho do Chatwoot, você pode montar uma integração completa do WhatsApp com seu chatbot sem gastar nada (além do seu tempo e sanidade).

Neste tutorial, vamos te guiar pelo processo do zero até o robô te responder no Zap como se fosse sua ex pedindo atenção.

🛠️ 1. Ferramentas que você vai usar (ou amaldiçoar)

Node.js — O motor da bagaça.

whatsapp-web.js — A mágica que simula o navegador e conecta ao WhatsApp Web.

qrcode-terminal — O QR que você escaneia no terminal (bem hacker mesmo).

axios — Para conversar com o Chatwoot pela API.

sqlite3 — Um banco de dados humilde e eficaz.

Chatwoot — Central de atendimento que não reclama.

Hostinger VPS — Onde tudo roda enquanto você dorme.

📦 2. Iniciando o Projeto

🔹 Passo 1: Crie seu diretório e inicie o projeto

bash

Copiar

Editar

mkdir zapbot

cd zapbot

npm init -y

🔹 Passo 2: Instale as dependências

bash

Copiar

Editar

npm install whatsapp-web.js qrcode-terminal axios sqlite3 express

(Sim, o express também vai entrar na jogada com os webhooks, então já instala de uma vez.)

🤖 3. Criando o Bot (o coração da bagunça)

Crie um arquivo index.js com o seguinte esqueleto básico:

js

Copiar

Editar

const { Client, LocalAuth } = require('whatsapp-web.js');

const qrcode = require('qrcode-terminal');

const axios = require('axios');

const sqlite3 = require('sqlite3').verbose();

const client = new Client({

authStrategy: new LocalAuth(),

puppeteer: { headless: true }

});

// Banco de dados local

const db = new sqlite3.Database('./zap.sqlite');

// Criação da tabela de contatos se não existir

db.run("CREATE TABLE IF NOT EXISTS contatos (numero TEXT PRIMARY KEY, nome TEXT)");

client.on('qr', qr => {

qrcode.generate(qr, { small: true });

});

client.on('ready', () => {

console.log('🤖 Bot conectado com sucesso!');

});

client.on('message', async msg => {

const numero = msg.from.split('@')[0];

const texto = msg.body;

db.get("SELECT * FROM contatos WHERE numero = ?", [numero], async (err, row) => {

if (!row) {

db.run("INSERT INTO contatos (numero, nome) VALUES (?, ?)", [numero, numero]);

await axios.post('https://seuchatwoot.com/api/v1/accounts/1/contacts', {

inbox_id: 1,

name: numero,

identifier: numero,

phone_number: numero,

source_id: numero

}, {

headers: { api_access_token: 'SEU_TOKEN' }

});

console.log('Novo contato cadastrado:', numero);

}

await axios.post('https://seuchatwoot.com/api/v1/accounts/1/conversations', {

source_id: numero,

inbox_id: 1,

contact_id: numero,

message: { content: texto }

}, {

headers: { api_access_token: 'SEU_TOKEN' }

});

});

});

client.initialize();

🔗 4. Integração com Webhooks do Chatwoot

Crie um server.js só para receber as mensagens do Chatwoot e reenviar para o WhatsApp:

js

Copiar

Editar

const express = require('express');

const bodyParser = require('body-parser');

const { Client, LocalAuth } = require('whatsapp-web.js');

const client = new Client({ authStrategy: new LocalAuth() });

client.initialize();

const app = express();

app.use(bodyParser.json());

app.post('/webhook', (req, res) => {

const { phone, message } = req.body;

const numero = phone.includes('@c.us') ? phone : `${phone}@c.us`;

client.sendMessage(numero, message);

res.sendStatus(200);

});

app.listen(3000, () => console.log('🧲 Webhook pronto na porta 3000'));

E no seu painel do Chatwoot, configure o webhook para enviar as mensagens para http://seuip:3000/webhook.

📸 5. Rodando tudo e escaneando o QR

Execute:

bash

Copiar

Editar

node index.js

Aparecerá um QR Code. Escaneie com o WhatsApp do seu celular (vá em WhatsApp Web/Dispositivos conectados).

Pronto, o bot tá online.

🔄 6. Sessão Automática

O whatsapp-web.js salva as credenciais no diretório .wwebjs_auth.

Não precisa escanear o QR toda vez. Só rezar pro WhatsApp não revogar tudo aleatoriamente.

🔬 7. Teste o Ciclo Completo

Mande uma mensagem pro WhatsApp conectado.

O bot envia pro Chatwoot.

Responda pelo Chatwoot.

A resposta volta pro WhatsApp.

Você olha e diz: "Caraca, tá funcionando mesmo."

⚠️ 8. Limitações (Porque nada é perfeito)

Sem disparo em massa. Você vai ser banido, e com razão.

Sem suporte oficial. Isso aqui é gambiarra do bem.

Dependência do WhatsApp Web. Se mudar o layout, tudo quebra (de novo).

📌 9. Dicas da PixBugTech

Use o PM2 pra rodar o bot no seu VPS sem parar:

bash

Copiar

Editar

npm install -g pm2

pm2 start index.js --name zapbot

pm2 save

Instale o DB Browser for SQLite pra inspecionar o banco de dados.

Use ngrok para testar localmente webhooks se estiver sem VPS.

🚀 10. E Agora?

Automatize com IA!

Integre com CRMs, Google Sheets, Zapier...

Ou só fique se gabando por ter feito algo que muitos cobram caro pra entregar.

🎩 Link da Cartola

Quer mais tutoriais, links úteis e ferramentas mágicas?

👉 https://pixbugtech.com/linksuteis

🧠 Conclusão Final com 15% de Sarcasmo

Você acabou de montar uma central de atendimento automática usando ferramentas gratuitas, com um bot que não pede férias, nem vale-refeição. E se tudo der certo, seu cliente nunca vai saber que quem respondeu foi o Node.js de madrugada.