Construindo um chatbot do WhatsApp com tecnologia de IA: um guia passo a passo

Publicados: 2024-03-22

Resumo:

Aprenda passo a passo como construir um chatbot do WhatsApp com tecnologia de IA, aproveitando os recursos do Node.js e do OpenAI. Desde a configuração de uma conta comercial Meta até a integração da API do WhatsApp e OpenAI, este guia capacita as empresas a agilizar as interações com os clientes e desbloquear novas possibilidades na comunicação automatizada.

Na era digital de hoje, aproveitar o poder da inteligência artificial (IA) para melhorar as interações com os clientes é fundamental para as empresas que se esforçam para permanecer à frente no mercado. O WhatsApp, sendo uma das plataformas de mensagens mais utilizadas em todo o mundo, apresenta uma excelente oportunidade para as empresas interagirem com o seu público de forma eficaz. Entre no reino dos chatbots do WhatsApp com tecnologia de IA. Esses assistentes virtuais estão revolucionando o atendimento ao cliente, fornecendo suporte 24 horas por dia e simplificando os processos de comunicação.

Quer você seja uma startup em expansão ou uma empresa estabelecida, navegar pelas etapas de desenvolvimento pode ser mais simples com a abordagem certa. Neste guia abrangente, exploraremos os princípios fundamentais, procedimentos passo a passo e considerações cruciais necessárias para integrar a API do WhatsApp Business ao seu aplicativo Node.js. Aproveitando o poder dos recursos de processamento de linguagem natural da OpenAI, criaremos uma experiência de usuário perfeita que ressoe com seu público.

Desde a configuração da sua conta do WhatsApp Business até a integração da API da OpenAI com seu código Node.js, acompanhe enquanto desmistificamos o processo e capacitamos você a criar sua própria solução baseada em IA. Essa jornada transformadora para o domínio dos agentes conversacionais orientados por IA não é algo que você precisa realizar sozinho. Uma empresa de desenvolvimento de AI Chatbot pode servir como seu parceiro de confiança, fornecendo insights e experiência inestimáveis ​​ao longo do caminho. Vamos embarcar juntos nesta emocionante expedição.

Etapa 1: configurar conta empresarial e aplicativo Meta (Facebook)

  1. Primeiro crie uma conta comercial Meta (clique aqui).

Preencha os dados e clique em Enviar.

2. Crie um novo aplicativo Meta (Facebook) (clique aqui).

  • (Faça login) em sua conta de desenvolvedor Meta (Facebook).

Após o login, clique em “Meus aplicativos”

clique no meu aplicativo

3. Agora clique em “criar aplicativo”

4. Selecione “Outro” e clique em “próximo”.

5. Escolha o tipo de aplicativo: “Comercial” e clique em “Avançar”.

6. Forneça os detalhes do aplicativo e clique em “Criar aplicativo”

Etapa 2: Configurando o aplicativo Meta (Facebook) para integração com o WhatsApp

1. Adicione o WhatsApp ao seu aplicativo Meta (Facebook).

  • No “Painel de Desenvolvedores”, escolha seu aplicativo.
  • Localize “Adicionar produtos ao seu aplicativo” na guia do painel do seu aplicativo.
  • Escolha “WhatsApp” para configuração.
  • Selecione sua conta empresarial Meta (Facebook)
  • Navegue até Configurações do aplicativo> Básico na barra lateral
  • Salve as alterações.
  • Defina o modo de aplicativo como ativo

Etapa 3: gerar token do WhatsApp

Para obter um token de acesso permanente do WhatsApp, siga 1 a 3 etapas:

1. Crie um “Usuário do Sistema”:

  • Visite o Meta Business Suite.
  • Encontre sua conta comercial no menu suspenso superior esquerdo e clique no ícone Configurações (engrenagem).
  • Clique em Configurações comerciais.
  • Vá para Usuários > Usuários do sistema.
  • Adicione um usuário do sistema Admin.

2. Adicione ativos.

  • Após criar o usuário do sistema, clique em Adicionar Ativos.
  • Navegue até Aplicativos > “Nome do seu aplicativo”.
  • Selecione seu aplicativo e conceda controle total para gerenciá-lo.

3. Gere tokens de acesso de usuário do sistema.

  • Clique no botão Gerar Novo Token no usuário do sistema.

Escolha o aplicativo que usará o token e defina a expiração do token como nunca.

  • Selecione as permissões “whatsapp_business_messaging” e “whatsapp_business_management”.
  • Gere o token.
  • Copie o token de acesso e armazene-o com segurança.

4. Adicione um novo número comercial para WhatsApp

  • Você pode usar seu próprio número comercial ou o número de teste fornecido para seu chatbot do WhatsApp.
  • No Painel do desenvolvedor do WhatsApp, navegue até WhatsApp > Configuração da API na barra lateral.
  • Prossiga para a “Etapa 5: Adicionar um número de telefone”, clique em Adicionar número de telefone.
  • Forneça os detalhes necessários no formulário a seguir.
  • Verifique seu número usando o código recebido.
  • Depois de adicionado com sucesso, selecione seu número de telefone na Etapa 1 da configuração da API.

5. Adicione uma forma de pagamento

  • Para enviar mensagens via WhatsApp, você precisa de uma forma de pagamento válida. Visite aqui para obter detalhes.
  • Depois de adicionar seu número de telefone comercial, clique em “Adicionar forma de pagamento” para resolver o alerta “Método de pagamento válido ausente”.
  • Você será direcionado para as configurações da sua conta do WhatsApp. Clique em “Métodos de pagamento” > “Adicionar método de pagamento comercial” e siga as instruções para adicionar as informações do seu cartão.

6. Teste seu novo número comercial para WhatsApp

  • Retorne ao Painel do Desenvolvedor do WhatsApp, navegue até Configuração da API
  • Insira um número “Para” de teste.
  • Clique em “Enviar mensagem” para verificar a entrega bem-sucedida da mensagem.

Etapa 4: definir as configurações do Webhook da API do WhatsApp

1. Verifique o retorno de chamada do WhatsApp Webhook.

  • No Painel do desenvolvedor do WhatsApp, navegue até Configuração.
  • Em Webhook, clique em editar
  • Agora, precisamos fornecer um URL de webhook ativo e um token para o WhatsApp. O URL ativo é o URL do seu aplicativo, e o token também é gerado do seu lado. Na imagem abaixo, adicionei meu URL do Ngrok porque meu aplicativo Node.js está sendo executado no Ngrok e usei um UUID como token.
  • No processo de verificação, o WhatsApp envia uma solicitação GET ao URL de retorno para validar o token do hub. O código a seguir, escrito em Next.js (uma estrutura Node.js), trata desse processo de verificação. A verificação só será bem-sucedida se o seu código enviar um código de status 200 em resposta, conforme mostrado abaixo.
exportar função assíncrona GET(req: NextRequest) {

deixe hubMode = req.nextUrl.searchParams.get("hub.mode");

deixe hubChallenge = req.nextUrl.searchParams.get("hub.challenge");

deixe hubToken = req.nextUrl.searchParams.get("hub.verify_token");

//encontra o token no banco de dados

se (

hubMode === "inscrever-se" &&

hubToken === "<valor de .env OR do banco de dados>"

) {

console.log("verificado com sucesso");

retornar nova resposta(hubChallenge);

}

return new Response("Credenciais inválidas", { status: 400 });

}

  • Encontre o campo “mensagens” e inscreva-se marcando a caixa.
  • Agora precisamos do token de acesso do WhatsApp e do segredo do aplicativo do Facebook, que obtemos da mesma conta comercial do WhatsApp
  • Na imagem abaixo você vê o segredo do aplicativo do Facebook

também precisamos manter os seguintes dados destacados

Em nosso código, precisamos de vários identificadores, como token de acesso, segredo do aplicativo, número de teste, ID do número de telefone e ID da conta comercial. Esses identificadores nos ajudam a determinar de quem estamos recebendo mensagens e para quem precisamos enviar mensagens.

Etapa 5: Envio e recebimento de mensagens por meio de API

  • No código TypeScript fornecido, integramos com sucesso a API do WhatsApp para enviar e receber mensagens. Além disso, incorporei OpenAI e um modelo de IA personalizado e treinado para responder às mensagens recebidas, para meu objetivo.
  • O URL de retorno de chamada fornecido ao WhatsApp é usado para solicitações GET e POST. Quando uma mensagem é enviada para o número comercial, o WhatsApp aciona esse URL de retorno de chamada e envia a mensagem junto com os detalhes do usuário. O código a seguir lê essa mensagem e responde com base na lógica implementada.
  • A função POST é uma função assíncrona que lida com solicitações POST recebidas. Primeiro, ele analisa a solicitação recebida em JSON e extrai a mensagem enviada pelo usuário do WhatsApp. Se a mensagem estiver indefinida ou vazia, ela retornará uma resposta com status 200 e não prosseguirá.
  • A função então recupera o número de telefone comercial e o número de telefone do remetente da solicitação.
  • A função então prepara uma solicitação POST para enviar uma mensagem de volta ao usuário via WhatsApp. Ele constrói a URL da solicitação, define a mensagem a ser enviada e define as opções da solicitação, incluindo método, cabeçalhos e corpo.
  • A função então envia a solicitação usando a função fetch. Se a solicitação for bem-sucedida, ela retornará uma resposta com status 200. Se ocorrer um erro em qualquer ponto, ele será registrado no console.
  • A função getResponseNumber é uma função auxiliar que extrai o número de telefone do remetente da solicitação recebida.
  • Este código fornece um exemplo básico de como integrar uma aplicação Node.js com a API do WhatsApp Business, permitindo o envio e recebimento automatizado de mensagens.

// O WhatsApp irá acionar esta solicitação de postagem assim que o usuário fizer uma pergunta ao bot e também responder ao usuário

exportar função assíncrona POST(req: NextRequest) {

deixe res: any = aguarde req.json();

deixe questionFromWhatsapp =

res?.entrada?.[0]?.mudanças?.[0]?.valor?.mensagens?.[0]?.texto?.corpo; //pergunta recebida do Whatsapp

se (

questionFromWhatsapp == indefinido ||

questionFromWhatsapp.trim().length <= 0

) {

//se a solicitação for apenas sobre status, não prossiga

// return NextResponse.json({ mensagem: "recebida" });

return new Response("recebido", { status: 200 });

}

//obtém o ID do número de telefone da resposta. este número de telefone é um número comercial

const phoneNumberId=

res?.entrada?.[0]?.mudanças?.[0]?.valor?.metadados["phone_number_id"];

//este método retornará o número de telefone de quem a mensagem foi recebida

const ResponseNumber = getResponseNumber(res);

// recuperando o userId do banco de dados

tentar {

versão const = "v18.0";

//verifica se o limite foi atingido ou não

const número de telefone;

const destinatárioPhoneNumber = "+" + responseNumber;

// const accessToken = process.env.WHATSAPPTOKEN

const accessToken = "token que você obtém do Facebook";

tentar {

//--------------- Este código é para enviar mensagem para telegrama

const url = `https://graph.facebook.com/${version}/${phoneNumberId}/messages`;

//Define os dados a serem enviados no corpo da solicitação

dados constantes = {

produto_mensagem: "whatsapp",

destinatário_type: "individual",

para: `${recipientPhoneNumber}`,

digite: "texto",

texto: {

URL_de_visualização: falso,

body: "Olá, sou um chatbot, estou ocupado no momento, entrarei em contato com você em breve.",

},

};

//Define as opções para a solicitação de busca

opções const = {

método: "POSTAR",

cabeçalhos: {

"Tipo de conteúdo": "aplicativo/json",

Autorização: `Bearer ${accessToken}`,

},

corpo: JSON.stringify(dados),

};

// Faz a solicitação POST usando fetch

tentar {

resposta const = aguarda busca (url, opções);

if (!response.ok) {

lançar novo Erro (`Erro HTTP! Status: ${response.status}`);

}

dados const = aguardar resposta.json();

//Trata os dados conforme necessário

} pegar (erro) {

//Trata o erro conforme necessário

console.log(erro);

}

return new Response("recebido", { status: 200 });

} pegar (erro) {

console.log("erro", erro);

}

} catch (erro: qualquer) {

console.log(erro);

//mantém o log de erros no banco de dados, em caso de erro não identificado

}

}

const getResponseNumber = (res: qualquer) => {

retornar res?.entrada?.[0]?.mudanças?.[0]?.valor?.contatos[0]?.wa_id;

};

Conclusão

Neste guia completo, navegamos pelas complexidades da integração da API do WhatsApp Business com um aplicativo Node.js. Desde a configuração de webhooks até o processamento de mensagens recebidas e o envio de respostas personalizadas, cobrimos etapas essenciais, como manipulação de tokens de acesso, segredos de aplicativos, números de teste, IDs de números de telefone e IDs de contas comerciais.

Esta integração perfeita não só permite que as empresas automatizem a comunicação no WhatsApp, mas também abre uma infinidade de possibilidades, seja na criação de bots de suporte ao cliente, na automatização de esforços de marketing ou na realização de projetos pessoais. Ao embarcar nesta jornada, lembre-se de que esta é apenas uma base. A API do WhatsApp Business oferece uma infinidade de recursos adicionais esperando para serem explorados e integrados ao seu aplicativo.

À medida que você continua a refinar seus esforços de desenvolvimento de chatbot de IA, considere aproveitar a experiência de um Empresa de desenvolvimento de AI Chatbot . Seus insights e suporte podem catalisar seu progresso, garantindo que seus esforços de chatbot atinjam todo o seu potencial. Consulte sempre a documentação oficial da API do WhatsApp Business para obter informações abrangentes e precisas à medida que avança em sua jornada de desenvolvimento.