Introducción al etiquetado del servidor

El etiquetado del servidor es una nueva forma de usar Google Tag Manager para instrumentar tu aplicación en todos los dispositivos. Los contenedores de servidor usan la misma etiqueta, activador y modelo variable a la que estás acostumbrado, a la vez que proporcionan herramientas nuevas que te permiten medir la actividad del usuario donde sea que ocurra.

Una configuración de etiquetado típica sin etiquetado del servidor depende de un contenedor de la página para enviar datos de medición a varios servidores de colecciones. En la Figura 1, se muestra un ejemplo de cómo un contenedor web de Tag Manager que se ejecuta en un navegador web envía datos a varios servidores.

Figura 1: Diagrama de un sitio instrumentado para usar un contenedor web de Google Tag Manager.

Por el contrario, un contenedor del servidor no se ejecuta en el navegador del usuario ni en su teléfono. En su lugar, se ejecuta en un servidor que usted controla.

Figura 2: Ejemplo de una configuración de etiquetado que usa un contenedor de servidor.

El servidor se ejecuta en tu propio proyecto de Google Cloud Platform (o en un entorno diferente que elijas) y solo tú tienes acceso a los datos en el servidor hasta que elijas enviarlo a otro. Tienes el control total sobre la forma de los datos y la ubicación desde el servidor. Las etiquetas se compilan mediante la tecnología de JavaScript de zona de pruebas. Los permisos te dan visibilidad sobre lo que puede hacer la etiqueta, y las políticas te permiten establecer límites en el contenedor.

El servidor recibe solicitudes web del dispositivo del usuario y transforma esas solicitudes en eventos. Cada evento se procesa según las etiquetas, los activadores y las variables del contenedor. Las etiquetas, los activadores y las variables en un contenedor de servidor funcionan de la misma manera que en otros tipos de contenedores: los activadores examinan cada evento a fin de buscar ciertas condiciones y, cuando corresponde, activan etiquetas que envían los datos de eventos para que se procesen.

En este modelo, se presentan dos preguntas importantes para los contenedores de servidores:

• ¿Cómo llegan los datos de medición del dispositivo del usuario al contenedor del servidor?
• ¿Cómo se convierten en datos los datos de medición que se envían a un contenedor de servidor?

La respuesta a ambas preguntas es un tipo nuevo de entidad para su uso en contenedores de servidor: un cliente.

Cómo funcionan los clientes

Los clientes son adaptadores entre el software que se ejecuta en el dispositivo de un usuario y el contenedor de tu servidor. El cliente recibe datos de medición de un dispositivo, los transforma en uno o más eventos, enruta los datos que se procesarán en el contenedor y empaqueta los resultados para enviarlos de vuelta al solicitante.

Son muchísimas cosas. Veamos cada parte con más detalle. En la figura 3, se muestran los datos que fluyen al contenedor del servidor desde el navegador web del usuario y desde el servidor web hasta el contenedor del servidor.

Figura 3: Un cliente diferente controla cada transmisión de datos.

Los clientes reciben datos de medición de un dispositivo. Supongamos que deseas medir la actividad del usuario en tres lugares: un sitio web, una aplicación para teléfonos y una tostadora inteligente. Tu sitio web usa Google Analytics, la app para teléfonos usa Firebase Analytics y tu tostadora usa un protocolo propio llamado "ToastMeasure".

Instrumentar estos tres dispositivos con Google Tag Manager normalmente requeriría un contenedor diferente para cada plataforma. Dado que el contenedor del servidor no se ejecuta en el dispositivo, el mismo contenedor puede controlar la instrumentación de estadísticas para las tres plataformas de dispositivos. Sin embargo, hay un problema. No todos los dispositivos se comunican de la misma manera. El protocolo de Google Analytics no es lo mismo que el protocolo ToastMeasure. Aquí es donde los clientes entran.

En lugar de esos tres contenedores, tu contenedor del servidor tiene tres clientes. Cada cliente que procese cada solicitud que entre en el orden de prioridad será la de mayor prioridad primero. Lo primero que hará cada cliente es decidir si debe procesar ese tipo de solicitud. Si es así, el cliente "reclama" la solicitud y continúa con la siguiente etapa de procesamiento. El acto de reclamar la solicitud evita que se ejecuten los clientes posteriores. Si el cliente no puede procesar la solicitud, no hace nada y permite que los otros clientes decidan si desea procesar la solicitud.

Los clientes transforman los datos de las solicitudes en uno o más eventos. Una vez que el cliente de ToastMeasure reclamó una solicitud, debe transformarla en algo que el resto del contenedor entienda. Ese es un conjunto de eventos.

Los eventos son eventos que desea medir. Pueden ser de cualquier forma: start_toasting, finish_toasting o buy_bread. Hay algunas recomendaciones sobre la estructura de los eventos que genera un cliente, pero el único requisito es que el resto del contenedor las comprenda.

Los clientes ejecutan el contenedor. El cliente reclamó la solicitud y la convirtió en eventos. Ahora es el momento de las etiquetas, los activadores y las variables. El cliente pasa cada evento al resto del contenedor para su procesamiento posterior.

Los clientes empaquetan los resultados para enviarlos al dispositivo. Una vez que el contenedor se ejecuta, es hora de responder a la tostadora. La respuesta puede tener muchas formas. Tal vez, el cliente solo dice "OK, listo". Tal vez, una de las etiquetas quiera redireccionar la solicitud a otro servidor de colecciones. O tal vez una de las etiquetas le indique a las luces de la tostadora que cambien de color. Lo que se supone que suceda, el cliente debe empaquetar los resultados y enviarlos de vuelta al solicitante.

Afortunadamente, Tag Manager se encarga de gran parte de este proceso por usted. Los contenedores de servidor incluyen tres clientes: Google Analytics 4, Google Analytics: Universal Analytics y el Protocolo de medición. Estos clientes proporcionan las herramientas que necesitas para comenzar a instrumentar la aplicación en cuanto creas el contenedor.

Un ejemplo breve

Revisemos un ejemplo rápido para ver cómo se relacionan todas las piezas. En este ejemplo, crearás lo siguiente:

1. Un sitio web simple que use gtag.js para enviar un evento click a un contenedor de servidor.
2. Un cliente de Google Analytics 4 que recibe el evento
3. Un activador que se activa en un evento click.
4. Una etiqueta de Google Analytics 4 que envía los datos del evento a Google Analytics para su procesamiento

Para este ejemplo, supondremos que ya has creado e implementado el contenedor de tu servidor.

Configura gtag.js

Primero, configure gtag.js para enviar los datos a su contenedor del servidor. Con gtag.js, el envío de datos al contenedor de tu servidor funciona del mismo modo que el envío de datos a Google Analytics, con una sola modificación. Al igual que en la página de ejemplo a continuación, establece la opción de configuración transport_url para que apunte al contenedor del servidor.

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'TAG_ID', {
    transport_url: 'https://analytics.example.com',
  });
</script>

Reemplaza TAG_ID por tu ID de etiqueta. Reemplaza https://analytics.example.com con la URL del contenedor del servidor.

A continuación, agrega una función sendEvent() para controlar los eventos click:

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'TAG_ID', {
    transport_url: 'https://analytics.example.com',
  });

  function sendEvent() {
    gtag('event', 'click');
  }
</script>

<button onclick="javascript:sendEvent()">Send Event</button>

Reemplaza TAG_ID por tu ID de etiqueta. Reemplaza https://analytics.example.com con la URL del contenedor del servidor.

Con esta configuración, los controladores de eventos, como la función sendEvent() que se incluye en este ejemplo, enviarán un evento click a tu contenedor del servidor.

Nota: Para las instalaciones de Tag Manager, consulta “Envía datos a Tag Manager del servidor” a fin de obtener más detalles sobre cómo configurar los contenedores.

Cliente de Google Analytics 4

Tu contenedor necesita un cliente para recibir el evento una vez que llega al servidor. Afortunadamente, los contenedores del servidor vienen con un cliente Google Analytics 4 preinstalado, por lo que ya terminaste este paso.

Haga clic en Activador

A continuación, crea un activador que se active en el evento click. Crea un activador personalizado que se active cuando la variable integrada de Event Name sea igual a “click”.

Etiqueta de Google Analytics 4

Por último, adjunte una etiqueta GA4 al activador. Al igual que con los clientes, un contenedor del servidor viene con una etiqueta GA4 incluida. Solo cree la etiqueta, establezca su configuración y ahora que ha conectado su contenedor. Los clientes GA4 y las etiquetas GA4 están diseñados para funcionar en conjunto. Esto significa que todo lo que tienes que hacer es crear una etiqueta GA4 y su configuración se extraerá automáticamente de los eventos que salen del cliente.

Obtener vista previa del contenedor

Ahora que el contenedor está configurado, haga clic en Vista previa. Visita el sitio web en otra ventana del navegador. A medida que se envían solicitudes y eventos al contenedor del servidor, verás las solicitudes y los eventos en el lado izquierdo de la página de vista previa.

Una vez que estés satisfecho con los cambios, publica el contenedor del servidor.

Configura tu servidor para el modo de producción con entrega propia

Antes de enviar tráfico de producción al contenedor de tu servidor, te recomendamos que instales el servidor en tu dominio propio y lo actualices al modo de producción.