Ya está aquí la versión 7.0 de Zabbix y, con ella, está cobrando importancia un nuevo concepto de monitorización: la monitorización sintética.

El monitorizado sintético tiene como objetivo ampliar aún más la visibilidad de la que disponemos al realizar el monitorizado de páginas y aplicaciones web; se acabó lo de recibir únicamente un error HTTP con el código XYZ o un comentario del tipo «Ah, pero tal recurso tarda mucho en cargarse», ahora, junto con esta información, podemos añadir una captura de pantalla que muestre cómo se veía realmente la página en el momento en que se produjo el problema y ver de verdad lo que nuestro cliente estaba viendo.

Este seguimiento es posible gracias a una pizca de JavaScript y a otra buena dosis de Selenium WebDriver.

WebDriver – Selenium es una herramienta de automatización para realizar pruebas en aplicaciones web. Permite controlar un navegador web mediante programación (aquí es donde entra en juego JavaScript), interactuando con los elementos de la página, rellenando formularios, haciendo clic en botones y comprobando el comportamiento de la aplicación. Es ideal para pruebas automatizadas y repetitivas.

Para utilizar esta monitorización en Zabbix, necesitaremos trabajar en dos frentes: el primero es en el propio Front-End, donde se realiza la configuración del host, se vincula la plantilla y se configuran las macros según lo que desee monitorizar; esta es la parte sencilla. La segunda parte se lleva a cabo en la CLI: debemos indicar a Zabbix cuál es la URL de WebDrive que va a utilizar y debemos instanciar los colectores que realizarán la monitorización sintética.

Pasemos a la práctica, pues. En primer lugar, asegúrese de que dispone de la versión 7.0 de Zabbix; debido a diversas dependencias de la arquitectura de Zabbix, esta supervisión solo funcionará a partir de la versión 7.0.

A continuación, deberá disponer de la plantilla en su Zabbix, que puede adquirirse aquí: https://git.zabbix.com/projects/ZBX/repos/zabbix/browse/templates/app/website_browser

Por lo tanto, basta con crear un host, vincular la plantilla y rellenar las macros heredadas del host de la siguiente manera:

• {$WEBSITE.BROWSER} – Navegador que se utilizará para la recopilación de datos.
• {$WEBSITE.DOMAIN} – URL que se va a utilizar
• {$WEBSITE.GET.DATA.INTERVAL} – ¿Con qué frecuencia se llevará a cabo el seguimiento?
• {$WEBSITE.NAVIGATION.LOAD.MAX.WARN} – Tiempo, en segundos, que tiene el navegador para responder antes de que se considere un incidente
• {$WEBSITE.PATH} – Si es necesario acceder a alguna ruta distinta de la raíz (/) del sitio web. Ej.: https://zabbix.made4it.com.br/zabbix/index.php; en este caso, la ruta sería: /zabbix
• {$WEBSITE.RESOURCE.LOAD.MAX.WARN} – Tiempo, en segundos, que tienen los recursos de la página para responder antes de que se considere un incidente
• {$WEBSITE.SCHEME} – Si se utilizará HTTP o HTTPS
• {$WEBSITE.SCREEN.HEIGHT} – Altura de la captura de pantalla
• {$WEBSITE.SCREEN.WIDTH} – Ancho de la captura de pantalla

Una vez introducidos los archivos macro y creado el elemento, ahora debemos acceder a la interfaz de línea de comandos (CLI) del servidor para finalizar la instalación.

En la interfaz de línea de comandos (CLI) del servidor, debemos editar el archivo zabbix_server.conf e introducir las siguientes variables (por lo general, se encuentran al final del archivo)

WebDriverURL = ¿Cuál es la URL que permite acceder a Selenium?

Y

StartBrowserPollers = Número de pollers que se utilizarán para recopilar los elementos de tipo navegador

Si instala Selenium de forma local, puede dejar la variable configurada de la siguiente manera:

WebDriverURL=http://localhost:4444

En cuanto al número de pollers, podemos empezar con 1 e ir aumentándolo según sea necesario: StartBrowserPollers=1

Una forma sencilla de instalar Selenium es utilizarlo mediante un contenedor; para ello, primero debemos instalar Docker Engine en nuestro servidor y, a continuación, configurar el contenedor de Selenium. Para ello, podemos utilizar dos comandos:

• curl -fsSL https://get.docker.com -o get-docker.sh

Este primer comando es un script de instalación automática de Docker Engine en su servidor.

• docker run -d -p 4444:4444 -v /dev/shm:/dev/shm –restart unless-stopped selenium/standalone-chrome:latest

Y el segundo comando sirve para configurar el contenedor de Selenium en su servidor.

Para consultar el estado del contenedor, puede utilizar el comando

• Docker container ls –a

Una vez configurado el contenedor, basta con reiniciar el servicio del servidor Zabbix para que lea las nuevas variables y pueda utilizar Selenium y llevar a cabo la supervisión.

Volviendo al front-end, podemos acceder al panel de control del servidor que acabamos de supervisar, y el resultado esperado es:

Explicación de cada uno de los aspectos objeto de seguimiento:

1. Tiempo de carga:

• Webzada: Página web www.made4it.com.br Tiempo del evento de carga de la navegación: Representa el tiempo total de carga de la página, incluyendo todos los eventos desde el inicio de la navegación hasta que finaliza la carga de la página.
• Webzada: Página web www.made4it.com.br Tiempo del evento de carga de recursos: Indica el tiempo total necesario para cargar todos los recursos (imágenes, scripts, CSS, etc.) que requiere la página.

2. Ejemplo práctico en YouTube: El tiempo total que tarda en cargarse por completo la página de inicio de YouTube, incluidos los vídeos recomendados, los menús, la barra de búsqueda, etc.

3. Tamaño de la navegación:

• Webzada: Página web www.made4it.com.br Tamaño del cuerpo decodificado de la respuesta: el tamaño del cuerpo decodificado de la respuesta, es decir, el tamaño de los datos que realmente se han transferido y decodificado.
• Webzada: Página web www.made4it.com.br Tamaño del cuerpo codificado de la respuesta: el tamaño del cuerpo codificado de la respuesta, es decir, el tamaño de los datos antes de ser descodificados.
• Webzada: Página web www.made4it.com.br Tamaño de la transferencia durante la navegación: El tamaño total de los datos transferidos durante la navegación, incluyendo los encabezados y el cuerpo de la respuesta.

4. Ejemplo práctico en YouTube: El tamaño total de los datos transferidos al cargar la página de inicio de YouTube, incluidos todos los elementos visuales, scripts y demás recursos.

5. Tiempo de navegación:

• Webzada: Página web www.made4it.com.br Tiempo de obtención de recursos de navegación: Tiempo empleado en obtener los recursos de navegación.
• Webzada: Página web www.made4it.com.br Tiempo de consulta de DNS de navegación: Tiempo empleado en la resolución del DNS.
• Webzada: Página web www.made4it.com.br Tiempo de establecimiento de la conexión TCP: Tiempo empleado en el establecimiento de la conexión TCP, que es el proceso mediante el cual se establece una conexión TCP entre el cliente y el servidor.
• Webzada: Página web www.made4it.com.br Tiempo de negociación TLS: Tiempo empleado en la negociación TLS, que es el proceso de establecimiento de una conexión segura.
• Webzada: Página web www.made4it.com.br Tiempo de solicitud de navegación: Tiempo transcurrido desde el inicio de la solicitud hasta la respuesta del servidor.
• Webzada: Página web www.made4it.com.br Tiempo de respuesta de navegación: Tiempo de respuesta del servidor tras el envío de la solicitud.

6. Ejemplo práctico en YouTube: El tiempo que tarda el navegador en resolver la dirección de YouTube (tiempo de búsqueda de DNS), establecer una conexión TCP (tiempo de establecimiento de conexión TCP), negociar una conexión segura (tiempo de negociación TLS), solicitar recursos de la página (tiempo de solicitud) y recibir una respuesta del servidor (tiempo de respuesta).

7. Sincronización de recursos:

• Webzada: Página web www.made4it.com.br Tiempo de consulta de DNS de recursos: Tiempo empleado en la resolución de DNS para recursos individuales.
• Webzada: Página web www.made4it.com.br Tiempo de establecimiento de conexión TCP por recurso: Tiempo empleado en el establecimiento de conexión TCP para cada recurso individual.
• Webzada: Página web www.made4it.com.br Tiempo de negociación TLS por recurso: Tiempo empleado en la negociación TLS para recursos individuales.
• Webzada: Página web www.made4it.com.br Tiempo de solicitud de recursos: Tiempo de solicitud de recursos individuales.
• Webzada: Página web www.made4it.com.br Tiempo de respuesta de los recursos: Tiempo de respuesta de cada recurso individual.

8. Ejemplo práctico en YouTube: el tiempo que tarda cada recurso (imagen, vídeo, script, etc.) necesario para cargar la página de inicio de YouTube en ser solicitado, respondido y cargado en el navegador.

Gráficos y estadísticas

Cada gráfico muestra la evolución de las métricas a lo largo del tiempo, lo que permite identificar patrones y posibles cuellos de botella en el rendimiento. Los valores mínimos (mín.), medios (med.) y máximos (máx.) ayudan a comprender la distribución de las métricas:

• El «tiempo de carga» muestra la variación del tiempo total de carga de la página y de los recursos.
• El «tamaño de navegación» detalla el volumen de datos transferidos, lo que permite apreciar la eficiencia de la transferencia de datos.
• La sección «Tiempos de navegación» destaca los distintos tiempos que intervienen en la navegación, lo que ayuda a identificar qué etapas del proceso de navegación son las que más tardan.
• El análisis de tiempos de carga de los recursos se centra en los tiempos de carga de cada recurso, lo que ayuda a identificar aquellos recursos concretos que puedan estar provocando retrasos.

Estas métricas son fundamentales para supervisar el rendimiento del sitio web e identificar problemas que puedan afectar a la experiencia del usuario.