Monitoreo automático de sitios web con Headless Browser y Telegram Bot dentro de Latenode

Hola, soy Daniel de Latenode. Si tienes un sitio web hoy en día, probablemente estés usando algún tipo de marco de interfaz como React. En ese caso, muchos servicios de monitoreo podrían no funcionar correctamente con tu sitio web. 

Pero hay una solución. Podemos aprovechar el poder de un navegador sin interfaz gráfica en Latenode para crear un servicio de este tipo en tan solo 5 minutos. Además, agregaremos notificaciones de bots de Telegram usando nodos sin código, lo que garantizará que siempre estemos informados con notificaciones en tiempo real.

En este artículo, proporcionaremos una Instrucciones detalladas paso a paso sobre cómo crear un flujo de trabajo de automatización de monitoreo de sitios web en latenode.comEste proceso implica el uso de un navegador sin interfaz gráfica para verificar el rendimiento del sitio web y enviarle un mensaje de informe a través de un bot de Telegram, así como también cómo crear un bot de Telegram con BotFather.

Es más, hay una plantilla lista para usar de este flujo de trabajo te espera al final de este artículo, lo que te permitirá utilizar este escenario en tan solo un minuto.

¿Cuál es el plan?

Para crear un escenario de monitoreo web que envíe mensajes en Telegram, necesitas:

• Crea un bot de Telegram
• Crear un escenario de Latenode

¡Y es aún más fácil de lo que parece! Te lo muestro.

Creando un bot de Telegram

Su relación respetuosa con BotPadre es un elemento clave en este proceso. Pero no te preocupes, no hay nada que pueda causarte problemas. 

Después de iniciar una conversación con BotFather, siga estos pasos:

1. Acceder / newbot
   Después de eso, se te pedirá que le des un nombre a tu bot y que generes un nombre de usuario. Esta es una de esas ofertas que no puedes rechazar...
   ¡Genial! Ahora tienes una Bot de Telegram y una clave API ¡para ello!
2. Acceder  /ayuda, y  /establecerunirgrupos
   Para habilitar la posibilidad de invitar a su bot a chats grupales.

Ahora, Agrega tu bot a un chat grupal o crea uno nuevo con élEse será el lugar al que el bot enviará informes. Necesitará el ID de este chat más adelante en este flujo de trabajo. Para obtener el ID del chat, debes abrirlo usando Telegram Web.

Estás listo para cambiar al escenario de Latenode, ¡hagámoslo, no tardará mucho!

Creación de un escenario en latenode.com

Inicie sesión en latenode.com y cree un nuevo escenario. Aquí tienes el escenario que necesitas:

Este escenario activa un navegador sin interfaz gráfica una vez durante un período de tiempo determinado para verificar la página de autorización de Latenode en busca de un texto específico. y dependiendo de su presencia, envía mensajes positivos o negativos en Telegram.

Desglose del escenario:

1. Disparadores: Aquí verá un disparador de programación, que le permite activar una verificación de rendimiento en cualquier período de tiempo, y un disparador de webhook, que le proporciona un enlace personalizable para activar la activación en cualquier momento al usarlo.
2. Navegador sin interfaz gráfica: Toda la magia está sucediendo aquí. En este caso particular, HB va a este vídeo página y busca “Crea tu cuenta" texto. Si esta cadena existe, el resultado es verdadero, si no, falso.
3. Nodos de Telegram: Nodos sin código que envían el mensaje dependiendo de los resultados de ejecución del nodo Headless Browser.

Navegador sin interfaz gráfica: las conexiones de Telegram tienen filtros. El nodo superior de Telegram se ejecuta si el resultado del nodo HB es verdadero. El inferior se activa si el resultado es falso.

La misión es clara, ¡acción!

1. Gatillos

Crea un nuevo escenario, luego haz clic en “Agregar nodo”, ve a Herramientas y en la sección de disparadores verás Programar. Establezca el período de activación, seleccione la zona horaria y guarde los cambios.
Después de eso, “agrega nodo” una vez más y ve al webhook Trigger.No es necesario que lo configures, pero puedes personalizar el enlace si lo deseas. Guarda los cambios.

2. Navegador sin interfaz gráfica

Haga clic en “agregar nodo”, Vaya al código y seleccione Navegador sin interfaz gráfica.Este es el código que estoy usando:

await page.goto('https://app.latenode.com/auth', { waitUntil: 'networkidle2' });

// The waitForSelector is used here to ensure that the React app has finished rendering.
// This is a simple approach and might need to be adjusted based on the actual app behavior.
await page.waitForSelector('[data-test-id="authEmailInput"]', { timeout: 10000 });

// Check if the specific string exists on the page
const isStringPresent = await page.evaluate(() => {
    return document.body.textContent.includes('Create your account');
});

return { "result": isStringPresent };

Simplemente copie este código en el campo de entrada y listo.

Nota: Este es solo un ejemplo simple. Puedes crear cualquier lógica aquí. El navegador sin interfaz gráfica de Latenode te ofrece una gran variedad de posibilidades con una biblioteca Puppeteer.

Si desea comprobar cómo funciona su código sin activar todo el escenario, utilice el botón “Ejecutar nodo una vez”. Esto guardará automáticamente los cambios y ejecutará solo este nodo. Esto también hace que los datos de este nodo sean útiles en el próximo nodo. Hablando de ellos…

3. Nodos y filtros de Telegram

Ahora tienes que agregar nodos de Telegram para que el bot te tenga en cuenta sobre el rendimiento del sitio web.

Haga clic en "agregar nodo" y busque la API del bot de Telegram.. Aquí estás buscando “enviar un mensaje de texto o responder”. Agregue 2 nodos de este tipo y conéctelos al nodo HB.

Antes de configurar estos nodos, haga clic en la conexión y seleccione “filtro de configuración”. En esta ventana, se nombra el filtro en el campo “etiqueta”. En la condición, se elige la opción resultado desde el nodo HB en el widget Helper, luego = en COMPARAR y su verdadero en PALABRAS CLAVE. Guarde los cambios. 

El nodo conectado se ejecutará si se ejecuta el navegador sin cabeza. exitosos.

Luego haz el negativo. Haz lo mismo, pero elige false en PALABRAS CLAVE.

Ahora los nodos mismos.

Para configurarlos:

1. Coloque el token de acceso de su bot de BotFather en “conexión”
2. Coloque el ID de chat de un chat grupal con su bot (podrías verlo usando Telegram Web)
3. Escribe el texto del mensaje de un bot.
4. Seleccionar modo de análisisCambia la apariencia del mensaje.

¡Eso es todo! ¡Ahora es el momento de guardar el escenario y desplegarlo! Esto hará que el escenario se active automáticamente.
Y como prometí antes, puedes obtener este escenario de Latenode como una plantilla lista para usar. aquí.

Conclusión

¡Felicitaciones, usted acaba de convertirse en el arquitecto estimado de su propio flujo de trabajo de monitoreo de sitios web! A partir de ahora, el poder de personalizar y adaptar este escenario a sus necesidades particulares está en sus manos. El único límite a la versatilidad de su enfoque es su propia imaginación.

Recuerde que no está solo en este viaje de automatización de bajo código. Si alguna vez te encuentras luchando por recrear este escenario o si simplemente estás buscando personas con ideas afines para compartir tu pasión, únete a nosotros en nuestro Canal de discordiaAllí, podrás encontrar apoyo de mi parte, de los desarrolladores de Latenode y de una creciente comunidad de entusiastas del low-code. ¡Esperamos contar con tu presencia!