Microsoft Azure cuenta con una gran cantidad de servicios y cada cierto tiempo lanzan previews para que los utilicemos y brindemos feedback, hoy vamos a hablar de un servicio llamado Application Insights.
¿Qué es Application Insights?
Application Insights es un servicio analítico para aplicaciones y sitios web que nos permite monitorear errores, rendimiento, uso, entre otros. Si anteriormente han trabajado con Telemetría este servicio pertenece a este ámbito, para los que no saben lo que es la Telemetría según Wikipedia es una tecnología que permite medición de magnitudes físicas y el posterior envío de la información hacia el operador del sistema, por ejemplo en los volcanes se utiliza para enviar datos a la institución que vela por el monitoreo de éstos.
¿Para qué me sirve?
- Analizar patrones de uso: visitas a ciertas páginas, cantidad de usuarios, zona geográfica de los usuarios, entre otros.
- Detectar y diagnosticar: obtenemos información de errores, rendimiento, tiempos de respuesta, uso de CPU, entre otros. Cabe destacar que todo esto se puede realizar en producción.
¿Qué puedo hacer con los datos obtenidos?
Pueden ser analizados con el propio portal de Azure, Power BI, SQL Server o incluso herramientas propias.
¿Dónde lo puedo utilizar (tecnologías) ?
Application Insights ofrece un gran soporte para diversas tecnologías como .NET, nodeJS, Python, IIS, J2EE, Ruby, Java, Android, PHP, iOS, entre otros. En este link pueden encontrar todas las plataformas soportadas.
Bueno ya que tenemos una noción básica de este servicio vamos a utilizarlo con un sitio web básico, lo primero será ingresar en Microsoft Azure y crear una aplicación web (en el momento que la creamos también se crea nuestro servicio de Application Insights). Acá ingresamos nuestro url (la que deseemos) y podemos dejar las configuraciones restantes como aparecen.
Cuando se crea vamos a descargar nuestro perfil de publicación
Seguidamente vamos a abrir nuestro servicio de Application Insights, para ello damos click en «Examinar» y seleccionamos el servicio.
Acá vamos a elegir el que tenga el nombre similar al sitio web que acabamos de crear
Cuando se abre por primera vez nos va aparecer una ayuda para que aprendamos a utilizarlo, vamos a dar click en supervisar la aplicación del lado del cliente.
Vamos a copiar el script que nos despliega, nótese que hay una variable llamada instrumentationKey a la cual le enviamos el id de nuestro servicio
Ahora vamos a agregar el script, en mi caso utilizaré Web Matrix y crearemos dos páginas con el siguiente contenido
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Index</title> <script type="text/javascript"> var appInsights=window.appInsights||function(config){ function r(config){t[config]=function(){var i=arguments;t.queue.push(function(){t[config].apply(t,i)})}}var t={config:config},u=document,e=window,o="script",s=u.createElement(o),i,f;for(s.src=config.url||"//az416426.vo.msecnd.net/scripts/a/ai.0.js",u.getElementsByTagName(o)[0].parentNode.appendChild(s),t.cookie=u.cookie,t.queue=[],i=["Event","Exception","Metric","PageView","Trace"];i.length;)r("track"+i.pop());return r("setAuthenticatedUserContext"),r("clearAuthenticatedUserContext"),config.disableExceptionTracking||(i="onerror",r("_"+i),f=e[i],e[i]=function(config,r,u,e,o){var s=f&&f(config,r,u,e,o);return s!==!0&&t["_"+i](config,r,u,e,o),s}),t }({ instrumentationKey:"ID APPLICATION INSIGHTS" }); window.appInsights=appInsights; appInsights.trackPageView("Index"); </script> </head> <body> Página principal <a href="contacto.html">Ir a Contacto</a> </body> </html>
contacto.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Contacto</title> <script type="text/javascript"> var appInsights=window.appInsights||function(config){ function r(config){t[config]=function(){var i=arguments;t.queue.push(function(){t[config].apply(t,i)})}}var t={config:config},u=document,e=window,o="script",s=u.createElement(o),i,f;for(s.src=config.url||"//az416426.vo.msecnd.net/scripts/a/ai.0.js",u.getElementsByTagName(o)[0].parentNode.appendChild(s),t.cookie=u.cookie,t.queue=[],i=["Event","Exception","Metric","PageView","Trace"];i.length;)r("track"+i.pop());return r("setAuthenticatedUserContext"),r("clearAuthenticatedUserContext"),config.disableExceptionTracking||(i="onerror",r("_"+i),f=e[i],e[i]=function(config,r,u,e,o){var s=f&&f(config,r,u,e,o);return s!==!0&&t["_"+i](config,r,u,e,o),s}),t }({ instrumentationKey:"ID APPLICATION INSIGHTS" }); window.appInsights=appInsights; appInsights.trackPageView("Contacto"); </script> </head> <body> Página de contacto <a href="index.html">Ir a Index</a> </body> </html>
Como se puede observar hemos agregado el script antes de la etiqueta de cierre </head> ya que así lo indican las instrucciones, la variable instrumentationKey tiene el valor del Id de nuestro servicio (por defecto este valor ya viene cuando se copia el script).
Ahora analicemos la siguiente línea que hemos modificado del script original a la que le indicamos que haga un rastreo de la vista de una página y le enviamos el nombre de la página por parámetros por lo que podemos obtener estadísticas de cuántas visitas tienen nuestras páginas
appInsights.trackPageView("Contacto");
De manera que queda así
Vamos a proceder a publicar nuestro sitio web
Seleccionamos importar perfil de publicación
Navegamos hasta nuestro archivo que descargamos previamente, normalmente tiene el nombre igual al sitio web que creamos
Cuando se carga nos va aparecer la siguiente ventana con unos datos los cuales vamos a dejarlos tal y como están ya que permiten conectarnos a nuestro sitio web en Azure
Después Web Matrix va verificar si nuestro sitio web local es compatible con los soportados de Microsoft Azure
Una vez que se ha verificado la compatibilidad vamos a observar los cambios que se van a realizar, en este caso se agregarán dos páginas web
Luego los archivos empezarán a cargarse a Microsoft Azure
Cuando finaliza la carga nos va informar y damos a dar click en la url
Observar emosun resultado similar al siguiente
Página Index
Página Contacto
Ahora vamos a regresar a Microsoft Azure y vamos a actualizar el servicio de Application Insight vinculado
Cuando se actualiza se nos desplegarán unos datos, de momento el tiempo de carga de las páginas
Recordemos que agregamos un rastreo tanto a la página de Index como de Contacto por lo que vamos a verificar si realmente están funcionando, para ello seleccionamos la opción de búsqueda y se nos desplegarán las siguientes estadísticas.
Bueno hemos aprendido a vincular Application Insights con un sitio web en este caso del lado del cliente. El mundo de la telemetría es muy importante y nos va facilitar muchas tareas, además podemos obtener ventaja de nuestros competidores al utilizar este servicio 🙂