Creación de un chatbot de WhatsApp con tecnología de inteligencia artificial: una guía paso a paso

Publicado: 2024-03-22
IA/ML 9 minutos 4
22 de marzo de 2024

Resumen:

Aprenda cómo crear paso a paso un chatbot de WhatsApp con tecnología de inteligencia artificial, aprovechando las capacidades de Node.js y OpenAI. Desde la configuración de una meta cuenta comercial hasta la integración de la API de WhatsApp y OpenAI, esta guía permite a las empresas optimizar las interacciones con los clientes y desbloquear nuevas posibilidades en la comunicación automatizada.

En la era digital actual, aprovechar el poder de la inteligencia artificial (IA) para mejorar las interacciones con los clientes es primordial para las empresas que se esfuerzan por mantenerse a la vanguardia en el mercado. WhatsApp, al ser una de las plataformas de mensajería más utilizadas a nivel mundial, presenta una excelente oportunidad para que las empresas interactúen con su audiencia de manera efectiva. Ingrese al reino de los chatbots de WhatsApp con tecnología de inteligencia artificial. Estos asistentes virtuales están revolucionando el servicio al cliente, brindando soporte las 24 horas y agilizando los procesos de comunicación.

Ya sea que sea una startup floreciente o una empresa establecida, navegar a través de los pasos del desarrollo puede ser más sencillo con el enfoque correcto. En esta guía completa, exploraremos los principios fundamentales, los procedimientos paso a paso y las consideraciones cruciales necesarias para integrar la API de WhatsApp Business con su aplicación Node.js. Aprovechando el poder de las capacidades de procesamiento del lenguaje natural de OpenAI, crearemos una experiencia de usuario perfecta que resonará en su audiencia.

Desde configurar su cuenta de WhatsApp Business hasta integrar la API de OpenAI con su código Node.js, siga mientras desmitificamos el proceso y le permitimos crear su propia solución basada en IA. Este viaje transformador hacia el ámbito de los agentes conversacionales impulsados ​​por IA no es algo que deba emprender solo. Una empresa de desarrollo de AI Chatbot puede ser su socio de confianza y brindarle conocimientos y experiencia invaluables a lo largo del camino. Embárquemonos juntos en esta emocionante expedición.

Paso 1: Configurar la aplicación y cuenta comercial Meta (Facebook)

  1. Primero cree una cuenta comercial Meta (haga clic aquí).

Complete los detalles y haga clic en Enviar.

2. Cree una nueva aplicación Meta (Facebook) (haga clic aquí).

  • (Inicie sesión) en su cuenta de desarrollador Meta (Facebook).

Después de iniciar sesión, haga clic en "Mis aplicaciones"

haga clic en mi aplicación

3. Ahora haga clic en "crear aplicación"

4. Seleccione "Otro" y haga clic en "siguiente".

5. Elija el tipo de aplicación: "Negocios" y haga clic en "Siguiente".

6. Proporcione los detalles de la aplicación y haga clic en "Crear aplicación".

Paso 2: Configurar la aplicación Meta (Facebook) para la integración de WhatsApp

1. Agregue WhatsApp a su aplicación Meta (Facebook).

  • En el "Panel de desarrolladores", elija su aplicación.
  • Busque "Agregar productos a su aplicación" en la pestaña del panel de su aplicación.
  • Elija "WhatsApp" para la configuración.
  • Seleccione su cuenta comercial Meta (Facebook)
  • Vaya a Configuración de la aplicación > Básico en la barra lateral
  • Guardar cambios.
  • Establecer el modo de aplicación en vivo

Paso 3: Genera el token de WhatsApp

Para obtener un token de acceso permanente a WhatsApp, sigue de 1 a 3 pasos:

1. Cree un "Usuario del sistema":

  • Visite Meta Business Suite.
  • Busque su cuenta comercial en el menú desplegable superior izquierdo y haga clic en el ícono de Configuración (engranaje).
  • Haga clic en Configuración empresarial.
  • Vaya a Usuarios > Usuarios del sistema.
  • Agregue un usuario del sistema administrador.

2. Agregar activos.

  • Después de crear el usuario del sistema, haga clic en Agregar activos.
  • Vaya a Aplicaciones > “El nombre de su aplicación”.
  • Seleccione su aplicación y otorgue control total para administrarla.

3. Generar tokens de acceso de usuarios del sistema.

  • Haga clic en el botón Generar nuevo token en el usuario del sistema.

Elija la aplicación que utilizará el token y establezca el vencimiento del token en nunca.

  • Seleccione los permisos "whatsapp_business_messaging" y "whatsapp_business_management".
  • Genera el token.
  • Copie el token de acceso y guárdelo de forma segura.

4. Agregue un nuevo número comercial para WhatsApp

  • Puede utilizar su propio número comercial o utilizar el número de prueba proporcionado para su chatbot de WhatsApp.
  • En el Panel de desarrollador de WhatsApp, navegue hasta WhatsApp > Configuración de API en la barra lateral.
  • Continúe con el "Paso 5: Agregar un número de teléfono", haga clic en Agregar número de teléfono.
  • Proporcione los detalles requeridos en el siguiente formulario.
  • Verifique su número usando el código recibido.
  • Una vez agregado correctamente, seleccione su número de teléfono en el Paso 1 de la Configuración de API.

5. Agregue un método de pago

  • Para enviar mensajes a través de WhatsApp, necesita un método de pago válido. Visita aquí para más detalles.
  • Después de agregar el número de teléfono de su empresa, haga clic en "Agregar método de pago" para abordar la alerta "Falta un método de pago válido".
  • Serás dirigido a la configuración de tu cuenta de WhatsApp. Haga clic en "Métodos de pago" > "Agregar método de pago comercial" y siga las instrucciones para agregar la información de su tarjeta.

6. Pruebe su nuevo número comercial para WhatsApp

  • Regrese al Panel de desarrolladores de WhatsApp, navegue hasta Configuración de API
  • Ingrese un número "Para" de prueba.
  • Haga clic en "Enviar mensaje" para verificar la entrega exitosa del mensaje.

Paso 4: Configurar los ajustes del webhook de la API de WhatsApp

1. Verifique la devolución de llamada del Webhook de WhatsApp.

  • En el Panel de desarrollador de WhatsApp, navegue hasta Configuración.
  • En Webhook, haga clic en editar
  • Ahora, debemos proporcionar una URL de webhook en vivo y un token a WhatsApp. La URL activa es la URL de su aplicación y el token también se genera desde su parte. En la imagen a continuación, agregué mi URL de Ngrok porque mi aplicación Node.js se ejecuta en Ngrok y usé un UUID como token.
  • En el proceso de verificación, WhatsApp envía una solicitud GET a la URL de devolución de llamada para validar el token del centro. El siguiente código, escrito en Next.js (un marco de Node.js), maneja este proceso de verificación. La verificación solo será exitosa si su código envía un código de estado 200 como respuesta, como se muestra a continuación.
exportar función asíncrona GET(req: NextRequest) {

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

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

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

//busca el token en la base de datos

si (

hubMode === "suscribir" &&

hubToken === "<valor de .env O de la base de datos>"

) {

console.log("verificado exitosamente");

devolver nueva respuesta (hubChallenge);

}

devolver nueva respuesta ("Credenciales no válidas", {estado: 400});

}

  • Busque el campo "mensajes" y suscríbase marcando la casilla.
  • Ahora necesitamos el token de acceso de WhatsApp y el secreto de la aplicación de Facebook que obtenemos de la misma cuenta comercial de WhatsApp.
  • En la imagen de abajo ves la aplicación secreta de Facebook.

También necesitamos mantener los siguientes datos resaltados.

En nuestro código, necesitamos varios identificadores, como el token de acceso, el secreto de la aplicación, el número de prueba, el ID del número de teléfono y el ID de la cuenta comercial. Estos identificadores nos ayudan a determinar de quién recibimos mensajes y a quién debemos enviar mensajes.

Paso 5: enviar y recibir mensajes a través de API

  • En el código TypeScript proporcionado, hemos integrado con éxito la API de WhatsApp para enviar y recibir mensajes. Además, he incorporado OpenAI y un modelo de IA personalizado para responder a los mensajes entrantes, para mi objetivo.
  • La URL de devolución de llamada proporcionada a WhatsApp se utiliza tanto para solicitudes GET como POST. Cuando se envía un mensaje al número comercial, WhatsApp activa esta URL de devolución de llamada y envía el mensaje junto con los detalles del usuario. El siguiente código lee ese mensaje y responde según la lógica implementada.
  • La función POST es una función asincrónica que maneja solicitudes POST entrantes. Primero analiza la solicitud entrante en JSON y extrae el mensaje enviado por el usuario desde WhatsApp. Si el mensaje no está definido o está vacío, devuelve una respuesta con un estado de 200 y no continúa.
  • Luego, la función recupera el número de teléfono comercial y el número de teléfono del remitente de la solicitud.
  • Luego, la función prepara una solicitud POST para enviar un mensaje al usuario a través de WhatsApp. Construye la URL para la solicitud, define el mensaje que se enviará y establece las opciones de la solicitud, incluidos el método, los encabezados y el cuerpo.
  • Luego, la función envía la solicitud utilizando la función de recuperación. Si la solicitud tiene éxito, devuelve una respuesta con un estado de 200. Si ocurre un error en algún momento, se registra en la consola.
  • La función getResponseNumber es una función auxiliar que extrae el número de teléfono del remitente de la solicitud entrante.
  • Este código proporciona un ejemplo básico de cómo integrar una aplicación Node.js con la API de WhatsApp Business, lo que permite el envío y la recepción automatizados de mensajes.

// WhatsApp activará esta solicitud de publicación una vez que el usuario haga una pregunta al bot y también responda al usuario

exportar función asíncrona POST(req: NextRequest) {

let res: any = await req.json();

dejar preguntaDeWhatsapp =

res?.entrada?.[0]?.cambios?.[0]?.valor?.mensajes?.[0]?.texto?.cuerpo; //pregunta recibida de whatsapp

si (

preguntaDeWhatsapp == indefinido ||

questionFromWhatsapp.trim().longitud <= 0

) {

//si la solicitud es solo sobre el estado, no avance más

// devuelve NextResponse.json({ mensaje: "recibido" });

devolver nueva respuesta ("recibido", { estado: 200 });

}

//obtiene la identificación del número de teléfono de la respuesta. este número de teléfono es un número comercial

const número de teléfonoId =

res?.entrada?.[0]?.cambios?.[0]?.valor?.metadatos["número_teléfono_id"];

//este método devolverá el número de teléfono de quien se recibió el mensaje

const número de respuesta = getNúmero de respuesta (res);

// recuperando el ID de usuario de la base de datos

intentar {

versión constante = "v18.0";

//comprobar si se alcanzó el límite o no

número de teléfono constante;

const número de teléfono del destinatario = "+" + número de respuesta;

// const accessToken = proceso.env.WHATSAPPTOKEN

const accessToken = "token que obtienes de Facebook";

intentar {

//----------------------- Este código es para enviar mensaje a Telegram

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

//Definir los datos a enviar en el cuerpo de la solicitud

datos constantes = {

mensaje_producto: "whatsapp",

tipo_destinatario: "individual",

a: `${recipientPhoneNumber}`,

teclee el texto",

texto: {

vista previa_url: falso,

body: "Hola, soy un chatbot, actualmente estoy ocupado, me comunicaré contigo pronto.",

},

};

// Definir las opciones para la solicitud de recuperación

opciones constantes = {

método: "POST",

encabezados: {

"Tipo de contenido": "aplicación/json",

Autorización: `Portador ${accessToken}`,

},

cuerpo: JSON.stringify (datos),

};

// Realizar la solicitud POST usando fetch

intentar {

respuesta constante = esperar a buscar (url, opciones);

si (!respuesta.ok) {

throw new Error(`¡Error HTTP! Estado: ${response.status}`);

}

datos constantes = espera respuesta.json();

// Maneja los datos según sea necesario

} captura (error) {

// Maneja el error según sea necesario

consola.log(error);

}

devolver nueva respuesta ("recibido", { estado: 200 });

} captura (error) {

console.log("error", error);

}

} captura (error: cualquiera) {

consola.log(error);

//mantener el registro de errores en la base de datos, en caso de un error no controlado

}

}

const getResponseNumber = (res: cualquiera) => {

devolver res?.entrada?.[0]?.cambios?.[0]?.valor?.contactos[0]?.wa_id;

};

Conclusión

En esta guía completa, hemos explorado las complejidades de integrar la API de WhatsApp Business con una aplicación Node.js. Desde la configuración de webhooks hasta el procesamiento de mensajes entrantes y el envío de respuestas personalizadas, hemos cubierto pasos esenciales como el manejo de tokens de acceso, secretos de aplicaciones, números de prueba, ID de números de teléfono e ID de cuentas comerciales.

Esta perfecta integración no solo permite a las empresas automatizar la comunicación en WhatsApp, sino que también abre una infinidad de posibilidades, ya sea creando bots de atención al cliente, automatizando esfuerzos de marketing o llevando a cabo proyectos personales. Al embarcarse en este viaje, recuerde que esto es simplemente una base. La API de WhatsApp Business ofrece una gran cantidad de funciones adicionales que esperan ser exploradas e integradas en su aplicación.

A medida que continúa perfeccionando sus esfuerzos de desarrollo de chatbots de IA, considere aprovechar la experiencia de un Empresa de desarrollo de chatbots de IA . Sus conocimientos y apoyo pueden catalizar su progreso, garantizando que sus esfuerzos de chatbot alcancen su máximo potencial. Consulte siempre la documentación oficial de la API de WhatsApp Business para obtener información completa y precisa a medida que avanza en su viaje de desarrollo.