Analíticas web anónimas en tu proyecto con Nuxt

El problema de la analítica tradicional

Hasta hace pocos años era normal que para medir el tráfico de nuestro sitio web utilizáramos Google Analytics, ya que es una herramienta muy potente y completa que nos ayuda a conocer cómo las personas interactúan con nuestro sitio, y a través de los datos obtenidos saber qué páginas o contenido interesan más para tomar decisiones e ir mejorando el contenido.

Con la gran cantidad de datos que se recopilan podemos saber desde qué lugar del mundo entran a nuestro sitio web con mucha precisión, el tiempo que permanecen en el sitio, identificar qué paginas no son intuitivas para encontrar la información que se busca y muchas otras métricas.

Pero la pregunta es: ¿Cómo se obtienen estos datos? Básicamente cuando nuestra aplicación recibe una petición a una página estas herramientas de analíticas suelen enviar otra petición en paralelo con un conjunto de datos, los cuales podemos dividir en datos anónimos y datos identificativos.

Los datos anónimos no permiten identificar a un usuario de ningún modo, estos son por ejemplo: El navegador que usa, el tipo de dispositivo desde el que se accede o por ejemplo la fecha en la que accede.

Los datos identificativos por el contrario pueden permitir identificar a una persona. Por ejemplo la dirección IP con la que accedió a la web puede ofrecer datos como su país, ciudad e incluso algo más preciso. Esto también ocurre con los datos que podemos introducir en formularios como nuestro nombre o dirección de correo electrónico.

Sabiendo esto se entiende mejor por que estos servicios son "gratuitos": Los usuarios están pagando con su información personal.

Alternativas a Google Analytics

Si mantener la privacidad de los usuarios que acceden a tus aplicaciones es algo importante para ti tal vez te hayas planteado el usar otra herramienta para medir el funcionamiento de tu contenido. Y es algo normal porque para saber si un contenido que acabas de publicar tiene buena acogida entre tu público, no necesitas saber dónde viven ni qué han comido hoy o qué estaban pensando comprar en Amazon.

Pero tengo una buena noticia, hay varias alternativas y una bastante sencilla de implementar, que no usa cookies y te da una cantidad de datos decente para empezar a medir el tráfico de tu web es Chiffre.io.

Esta herramienta tiene varios puntos interesantes:

• Respeta la normativa RGPD.
• Los datos viajan encriptados: Desde Chiffre no acceden a los datos de tu sitio web ni tus usuarios.
• No obtienen datos identificativos de los usuarios.
• Es de código abierto: Puedes consultar su repositorio en Github
• Puede funcionar sin conexión.

Además tiene una versión gratuita que nos permite registrar hasta 3 sitios web y 200 eventos por sitio web al día, por lo que si quieres echarle un vistazo y probarlo no va a costarte ni un céntimo.

Las versiones de pago ofrecen más funcionalidades y menos limitaciones, siendo estas la versión Personal con un coste de 12 euros al mes y la versión Business con un coste de 72 euros al mes, siendo este tal vez un punto malo ya que actualmente no tienen un servicio de pago por uso en el que puedas ir pagando según tu sitio crezca, pero esperemos que lo añadan.

Registro en Chiffre.io

Antes de probarlo en nuestra aplicación lo primero de todo es registrarnos en el sitio web https://chiffre.io/ seleccionando el plan gratuito, para lo que nos va a pedir únicamente una dirección de correo electrónico y que elijamos un nombre de usuario y contraseña.

Una vez completes el registro te facilitarán una clave de recuperación de cuenta, la cual debes guardar en un lugar seguro.

El siguiente paso es crear un proyecto al que vamos a asociar nuestra aplicación con Nuxt, lo que nos va a generar un identificador de proyecto y una clave pública.

Probando Chiffre con nuestra aplicación Nuxt

Realmente esto era lo difícil porque como siempre, para las cosas más útiles ya tenemos un módulo de Nuxt que nos va a ayudar a instalar nuestra herramienta con un mínimo de configuración. Este módulo es nuxt-chiffre.

Para instalarlo podemos utilizar npm o yarn:

npm install nuxt-chiffre

yarn add nuxt-chiffre

Para terminar vamos a añadir en nuestro fichero nuxt.config.js el nombre del módulo dentro del listado de módulos y un nuevo atributo chiffre para configurar el módulo.

export default {
  modules: ['nuxt-chiffre'],
  chiffre: {
    projectId: 'PROJECT_ID_FROM_CHIFFRE',
    publicKey: 'PUBLIC_KEY_CHIFFRE'
  }
}

Y con esto ya tenemos Chiffre funcionando en nuestra web, lo cual va a enviar un evento por cada cambio de página y podremos ver reflejado en la web de Chiffre accediendo al proyecto que hemos creado.

Una vez empecemos a recibir visitas en nuestra aplicación podremos ver los siguientes datos con el plan gratuito:

• Direcciones de las páginas visitadas y número de visitas.
• Referers: Desde donde llegan a nuestras páginas, tráfico directo, redes sociales, otras webs, etc.
• Navegadores desde los que se accede.
• Sistemas operativos desde los que se accede.
• Tipo de dispositivo: PC, tablet, móvil u ordenador portátil.
• Idioma: Este dato parece ser el idioma en el que está configurado el navegador del usuario al acceder.
• País: Desde dónde se realiza el acceso. Aunque este dato por las pruebas que he hecho no parece ser muy preciso. Además hay que tener en cuenta conexiones por VPN.

Ya sólo falta empezar a juntar datos y trabajarlos. En caso que necesitaras un plan de pago porque el tráfico de tu web es muy elevado siempre puedes valorar uno de los dos planes que ofrecen.