Conceptos básicos de validación de mensajes en programación

Clase 11 de 28 • Curso de ChatBot con WhatsApp API

Resumen

¿Cómo personalizar la respuesta de un bot para identificar al usuario?

El diseño de las respuestas de un bot es clave para lograr una interacción auténtica y personalizada con los usuarios. Para que el bot pueda identificar a cada usuario, necesitamos trabajar con ciertos elementos esenciales. En este caso, se utilizan dos: el ID del usuario compuesto por la lada del país y el número de WhatsApp, así como el nombre registrado. Al personalizar el saludo, el bot retorna un mensaje sensible que hace sentir al usuario valorado desde el primer contacto. Sin embargo, hay factores que debemos tener en cuenta:

Los nombres de los usuarios pueden contener caracteres especiales o emojis que no siempre cumplen con reglas estándar.
Aunque podemos usar expresiones regulares (regex) para extraer solo el primer nombre, esta no siempre es una solución universal.

El objetivo es establecer un mensaje de bienvenida cálido y desencadenar el flujo necesario.

¿Cómo configurar la lógica de identificación en el controller?

Para poder obtener la información del remitente, es esencial analizar la estructura del objeto de respuesta que nos ofrece la API que estamos utilizando. Necesitamos crear una constante llamada senderInfo, que nos ayude a acceder a los datos del contacto desde el primer índice del array de contactos. Este paso puede representarse con un código como el siguiente:

const senderInfo = response.contacts[0];

Es recomendable familiarizarse con esta estructura de datos, utilizando herramientas como Postman para observar la información detallada que se puede obtener y, en consecuencia, identificar los elementos que serán útiles en futuras implementaciones.

¿Cómo realizar un reconocimiento de saludos?

Para mejorar la interacción inicial del bot, se implementa una función que reconoce si un mensaje recibido es un saludo. Esto se puede lograr definiendo una función llamada isGreeting que devuelva un booleano.

function isGreeting(message) {
    const greetings = ['hello', 'hi', 'hola', 'buenas tardes'];
    return greetings.includes(message.toLowerCase().trim());
}

Con esta función, el bot puede distinguir entre mensajes de saludo y otros tipos de interacciones, permitiéndole responder adecuadamente.

¿Cómo enviar un mensaje de bienvenida personalizado?

Una vez identificado el saludo, es hora de enviar un mensaje de bienvenida personalizado. Para ello, se define una función asincrónica sendWelcomeMessage que conforma el saludo tomando en cuenta especificidades como el nombre del servicio ofrecido.

async function sendWelcomeMessage(user, messageId) {
    const welcomeMessage = `Hola, bienvenido a nuestro servicio de veterinaria online. ¿En qué puedo ayudarte hoy?`;
    await WhatsAppService.sendMessage(user, welcomeMessage, messageId);
}

Esta función se asegura de crear un sentimiento de acogida desde el primer contacto.

¿Cómo configurar la arquitectura y probar la lógica del bot?

Es crucial ajustar ciertos parámetros del entorno para que el bot funcione sin interrupciones:

Dentro de package.json, podemos agregar un script para facilitar el inicio del servidor:
```
"scripts": {
  "start": "nodemon src/app.js"
}
```
Verificar que el servidor está corriendo correctamente accediendo a la terminal y validando los últimos cambios con NodeMon.

Realizar pruebas es fundamental. Envía "hola", "hi" o cualquier otro saludo predefinido y verifica que el mensaje correcto regrese. Notarás que los mensajes no reconocidos como saludos seguirán usando la lógica previa, consistente en replicar el mensaje original.

Explora y comenta qué tipo de saludo te parecería más efectivo para este contexto.

Hugo Espinosa Callejas

student•

Para el caso de México hay un detalle ya que le pone un 1 después de código ejemplo: 521XXXXXXXXXX si quitas ese 1 funciona

async handleIncomingMessage(message) {
    if (message?.type === "text") {
      const incomingMessage = message.text.body.toLowerCase().trim();
      // Remove 1 from the position 2 in the from property
      const fromNumber = message.from.slice(0, 2) + message.from.slice(3);

      if (this.isGreeting(incomingMessage)) {
        await this.sendWelcomeMessage(fromNumber, message.id);
      } else {
        const response = `Echo: ${message.text.body}`;
        await whatsappService.sendMessage(fromNumber, response, message.id);
      }

      await whatsappService.markAsRead(message.id);
    }
  }

Oscar Barajas Tavares

Team Platzi•

Gracias por la aclaración.

Sabina de la Serna Espinosa

student•

ya lo cambie y sigue igual no entiendo0 nada

Fredy Yecid Castro Agray

student•

Todo este curso lo pueden dar para python ? @platzi?

Juan Antonio Martinez Gomez

student•

Los mismo he pensado!! Estaria excelente.

Mayra Alejandra Soto Nieto

student•

me sale un error al volver a ejecutar el comando de npm run start

Mayra Alejandra Soto Nieto

student•

Cristian Acalo

student•

Tenía el mismo error. Se solucionó cambiando la extensión del archivo nodemon.js a nodemon.json

Sebastián Mejía Ríos

student•

No sé si solo me pasa a mí pero esta clase es la 12 y debería ser a 11. Me había perdido en la configuración de la app.

Guillermo Leonardo Montaño Medina

student•

Tuve el mismo problema como por 2 semanas, me marcaba error y los aventaba medio raro

German Moreno Leiva

student•

pregunta, porque el puerto es 3001 y no el 3000 como en video anterior?

Pablo Andrés Ramírez

student•

Todos mis problemas se solucionaron cuando cambié la extención del nodemon.js a nodemon.json

Marcelo J. Gracia

student•

Estoy teniendo un error status 400 em el método sendToWhatsApp.

Luego de enviar un msg: "Hi", o cuaquier otro msg..

me marca como leido pero no responde..

const sendToWhatsApp = async (data) => {
    const baseUrl = `${config.BASE_URL}/${config.API_VERSION}/${config.BUSINESS_PHONE}/messages`;
    const headers = {
        Authorization: `Bearer ${config.API_TOKEN}`
    };

    try {
        const response = await axios({
            method: 'POST',
            url: baseUrl,
            headers: headers,
            data,
        })

        return response.data;
    } catch (error) {
        console.error(error)
    }
};

```no se donde puede estar el error, no lo encuentro!

Daniel Sandoval

student•

Para que no puedan ejecutar el servidor, solo ejecuten en la terminal > node src/app.js

Jose Alberto Gomez Macias

student•

Siento que este video tuvo que haber estado antes, no?

Oscar Zacaula

student•

Tuve problemas con el número de Mexico igual que Hugo el 1 después del 52 es el problema.

Lo que hice fue en messageHandler.js agregue: const fromNumber = this.formatNumber(message.from);```js const fromNumber = this.formatNumber(message.from);



```js
  formatNumber(number) {
    // Si el número empieza con "521", remueve el '1' para que quede "52" seguido del número
    if (number.startsWith("521")) {
      return "52" + number.slice(3);
    }
    return number; // Retorna el número sin cambios si no empieza con "521"
  }
}
```  formatNumber(number) {    // Si el número empieza con "521", remueve el '1' para que quede "52" seguido del número    if (number.startsWith("521")) {      return "52" + number.slice(3);    }    return number; // Retorna el número sin cambios si no empieza con "521"  }}



con esto me quedo funcionando!!

Daniel Stiven Lopez Carmona

student•

Muchas gracias, con ayuda de este código pude resolver el código mío ;)

andres arturo rios

student•

Nota para todos: Es necesario actualizar la configuración del webhook. De lo contrario, los mensajes no se recibirán correctamente en el puerto 3000 (actual) y seguirán intentando llegar al 3001 (anterior).

Magdalena Fernandez

student•

a alguno le salio este error ? que me pueda ayudar

andres arturo rios

student•

no puedo ver el error

Xara Beltran

student•

Hola compañeros no sé si les sirva el dato, pero a mí no me funcionaba por nada del mundo jaja tuve que modificar el archivo service.js de esta forma y ahí si me funcionó.```js import express from "express"; import 'dotenv/config'; import webhookController from "./src/controllers/webhookController.js";

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

const PORT = process.env.PORT || 3000;

// Conectar tu lógica real app.post("/webhook", webhookController.handleIncoming); app.get("/webhook", webhookController.verifyWebhook);

app.get("/", (req, res) => { res.send(<pre>API de WhatsApp activa. Usa /webhook para mensajes.</pre>); });

app.listen(PORT, () => { console.log(✅ Servidor escuchando en el puerto ${PORT}); });

Andres Felipe Florez Paternina

student•

Al decirle por ejemplo "hola como estas" me envía el echo, no debería al tomar el hola ignorar lo otro y enviar el mensaje de saludo?

Fredy Yecid Castro Agray

student•

Que cursos me sugieren de JS en platzi previos a este curso?

Jose Luis Bedoya

student•

los cursos de express! ya que es la tecnologïa que estamos usando para el curso

ANDRES ALFONSO MIRA MEJIA

student•

✅

JUAN PABLO PERNIA GADEA

student•

hola, al hacer el cambio en el nodemo.js el comando npm start, no levanta el localhost

Fredy O. Torres C.

student•

hice todo tal cual y me sigue enviando el mensaje Echo

Joel Marquez

student•

No he logrado solucionar mi error: Tengo esto en mi codigo:

webhookController.js:

import whatsappService from './whatsappService.js';


class MessageHandler {
  async handleIncomingMessage(message) {
    if (message?.type === 'text') {
      const incomingMessage = message.text.body.toLowerCase().trim();
      const fromNumber = this.formatNumber(message.from);

     if(this.isGreeting(incomingMessage)){
      await this.sendWelcomeMessage(fromNumber, message.Id);
     }
     else {
      const response = `Echo: ${message.text.body}`;
      await whatsappService.sendMessage(fromNumber, response, message.id);
     }
      await whatsappService.markAsRead(message.id);
    }
  }

  formatNumber(number) {
    // Si el número empieza con "571", remueve el '1' para que quede "57" seguido del número
    if (number.startsWith("571")) {
      return "57" + number.slice(3);
    }
    return number; // Retorna el número sin cambios si no empieza con "571"
  }

  isGreeting(message) {
    const greetings = ["hola", "hello", "hi", "buenas tardes"];
    return greetings.includes(message);
  } 

  async sendWelcomeMessage(to, messageId) {
    const welcomeMessage = "Hola, Bienvenido a nuestro servicio de atención al cliente." + "¿En que puedo ayudarte hoy?";
    await whatsappService.sendMessage(to, welcomeMessage, messageId); 
  }

}

export default new MessageHandler();
```y esto es el error que me da:



&#x20;   data: { error: \[Object] }

&#x20; },





&#x20; status: 400

}



Ya no se que hacer...  ;(

Jeremias Ezequiel Gonzalez

student•

Hola platzinauta!

Les dejo los aprendizajes en base a los errores que tuve:

Al principio del mensaje de error abra estas dos opciones:

Si hubo un error 401 al leer el mensaje:

En mi caso ocurrió que el token había vencido

solución: recargar la pagina donde generas el token y volverlo a generar

Si hubo un error 400 al enviar el mensaje y suponiendo que tienes el código igual que en el curso

solución agregar una función que corrija el numero que se agrega de mas: