Mon. Nov 11th, 2024

Ejecute Google Tag Supervisor y Google Analytics en archivos locales


Última actualización el 2 de marzo de 2018.

De vez en cuando, es posible que te pidan que corras Administrador de etiquetas de Google y/o Google Analytics en la zonaes decir, sin el beneficio de un servidor net que proporcione sus archivos. En otras palabras, estás cargando un archivo HTML desde tu computadora en el navegador net. Puede identificar un archivo ejecutado localmente mediante el archivo:/// protocolo en la barra de direcciones.

Ahora bien, implementar Google Tag Supervisor en ese archivo con la esperanza de ejecutar solicitudes de Google Analytics localmente no es del todo sencillo. Bueno, en realidad, la implementación es bastante easy, pero personalizarla para que realmente envíe visitas útiles requiere algunos ajustes.

¡Nota! Vas a no poder correr Avance modo con archivos locales. GTM utiliza automáticamente el protocolo relativo al descargar la biblioteca de vista previa, y el protocolo relativo en los archivos locales vuelve a file:/// para las solicitudes HTTP. Si a alguien se le ocurre una solución alternativa elegante, ¡hágamelo saber en los comentarios!


incógnita


El boletín a fuego lento

Suscríbete al Boletín a fuego lento para recibir las últimas noticias y contenido de Simo Ahava en su bandeja de entrada de correo electrónico.

1. Modifique el fragmento del contenedor GTM

En primer lugar, debe modificar el fragmento del contenedor de Google Tag Supervisor. se utiliza protocolo relativo en las URL del cargador de scripts, y dado que los archivos locales usan el archivo esquema URI, debe indicarle explícitamente a Google Tag Supervisor desde dónde obtener la biblioteca.

Entonces, si este es el fragmento del contenedor:


<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXXXX"
peak="0" width="0" model="show:none;visibility:hidden">iframe>noscript>
<script>(operate(w,d,s,l,i){w(l)=w(l)||();w(l).push({'gtm.begin':
new Date().getTime(),occasion:'gtm.js'});var f=d.getElementsByTagName(s)(0),
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,doc,'script','dataLayer','GTM-XXXXX');script>

Puedes ver cómo las dos URL incrustadas dentro (//www.googletagmanager.com/ns.html... en el iframe y //www.googletagmanager.com/gtm.js... en el propio cargador de scripts) no tienen un protocolo explícito establecido. Entonces, necesitas cambiar estas dos cadenas para convertirlas en https://www.googletagmanager.com/ns.html... y https://www.googletagmanager.com/gtm.js...respectivamente. Ese es el único cambio que debe realizar para cargar Google Tag Supervisor.

Entonces, ¡bien hecho!

El siguiente paso es configurar las etiquetas de Google Analytics. GA impone algunas restricciones al navegador net si se carga con su configuración predeterminada:

  1. El anfitrión que realiza las solicitudes a GA debe tener: http o https como el protocolo.

  2. El host debe admitir el almacenamiento de la ID del cliente en las cookies del navegador.

  3. El anfitrión debe poder pasar un valor de Ubicación del documento adecuado (la URL) a Google Analytics.

Cada uno de estos tres es violado por archivos locales. Primero, los archivos locales usan el archivo:/// protocolo, como ya se ha dicho. En segundo lugar, los navegadores net desactivan las cookies cuando navegan por archivos locales. En tercer lugar, la URL enviada por el cliente a Google Analytics en el campo Ubicación del documento es la que tiene el archivo Esquema de URI, nuevamente, lo que significa que GA no lo analiza correctamente en una ruta de página adecuada.

Afortunadamente, Google Analytics tiene campos que puede configurar para que pase estas tres comprobaciones.

Primero, necesitarás crear una variable auxiliar. es un Variable de JavaScript personalizada con el nombre Función vacía y el siguiente código dentro de:

operate() {
  return operate() {}
}

A continuación, en sus etiquetas de Google Analytics, busque Campos para configurary agregue los siguientes campos y valores:

Nombre del campo: checkProtocolTask
Valor del campo: {{Función vacía}}

Nombre del campo: almacenamiento
Valor del campo: ninguno

Nombre del campo: página
Valor del campo: {{Ruta de la página}}

El primer campo le cube a GA que no verifique el protocolo válido (http o https) al realizar la solicitud a /gather.

El segundo campo le indica a GA que no utilice cookies del navegador para conservar la ID del cliente.

El tercer campo le cube a GA que anule la ubicación del documento defectuoso con el nombre de ruta de la página.

¡Y eso es todo! Con estos pasos, puede realizar un seguimiento de sus páginas vistas y eventos en sus archivos locales, si así lo desea.

3. ID de cliente persistente

Sin embargo, la desventaja de establecer storage : none es que ya no tendrás una ID de cliente persistente. Por lo tanto, cada carga de página restablecerá la ID del cliente, lo que dará como resultado un nuevo usuario y una nueva sesión con cada página.

No queremos eso.

En lugar de eso, podemos solucionarlo usando el navegador. localStorage API para almacenar el ID del cliente y recuperarlo con cada solicitud.

necesitarás dos nuevas variables.

El primero es un Variable de JavaScript personalizada con el nombre JS: establecer _clientIdy el siguiente código dentro de:

operate() {
  return operate() {
    if (window.Storage) {
      window.localStorage.setItem('_clientId', ga.getAll()(0).get('clientId'));
    }
  }
}

El segundo es un Variable de JavaScript personalizada con el nombre JS: obtener _clientIdy el siguiente código dentro de:

operate() {
  if (window.Storage) 
  return;
}

La primera variable almacena el ID del cliente en el navegador. localStoragey la segunda variable la recupera del mismo lugar (o devuelve indefinido si el ID del cliente no está almacenado).

Finalmente, en sus Etiquetas de Google Analytics, vaya a Campos para configurar nuevamente y configure los dos campos siguientes:

Nombre del campo: hitDevolución de llamada
Valor del campo: {{JS – Establecer _clientId}}

Nombre del campo: ID de cliente
Valor del campo: {{JS – Obtener _clientId}}

¡Y ahí lo tienes! Ahora, la primera vez que se activa una etiqueta de Google Analytics, almacena el ID de cliente creado en el proceso en el navegador. localStorage. Para cada etiqueta posterior, hasta localStorage se purga manualmente, las etiquetas recuperan el ID de cliente almacenado de localStorage y enviarlo con las solicitudes. De esta manera, las sesiones y los usuarios permanecen intactos y usted podrá obtener información adecuada a partir de los datos.

Resumen

Este truco probablemente solo tenga un uso marginal, pero sigue siendo una forma válida de rastrear Google Analytics en archivos locales. No siempre se tiene el beneficio (o las habilidades para implementar) un servidor net, por lo que ejecutar archivos localmente es, al menos, un consejo para los sistemas de administración de contenido Notepad + FTP de la década de 1990.

Además, también puede utilizar el truco de ID de cliente en sus rastreadores habituales, si tiene algún motivo para evitar las cookies del navegador para datos persistentes.

Related Post

Leave a Reply

Your email address will not be published. Required fields are marked *