Seguimiento de aplicaciones de una sola página

En esta guía se describe cómo usar analytics.js para realizar el seguimiento de páginas en sitios web cuyo contenido se carga automáticamente sin las cargas de página completa tradicionales.

Descripción general

Una aplicación de una sola página es una aplicación web o un sitio web que carga todos los recursos necesarios para navegar por el sitio en la primera carga de la página. A medida que el usuario hace clic en los enlaces e interactúa con la página, el contenido posterior se carga de forma dinámica. Con frecuencia, la aplicación actualiza la URL en la barra de dirección para emular la navegación de página tradicional, pero no se vuelve a realizar otra solicitud de página completa.

El fragmento de código de seguimiento JavaScript predeterminado funciona bien con los sitios web tradicionales porque se ejecuta cada vez que los usuarios cargan una página nueva. Sin embargo, en el caso de las aplicaciones de una sola página, donde el nuevo contenido de página se carga dinámicamente en vez de realizar cargas de página completas, el código del fragmento analytics.js solo se ejecuta una vez. Por lo tanto, el seguimiento de las páginas vistas (virtuales) posteriores debe realizarse manualmente a medida que se carga nuevo contenido.

Realizar el seguimiento de las páginas vistas virtuales

Cuando tu aplicación carga contenido dinámicamente y actualiza la URL en la barra de direcciones, los datos almacenados en tu objeto de seguimiento también deben actualizarse.

Para actualizar el objeto de seguimiento, utiliza el comando set y facilita el nuevo valor de page:

ga('set', 'page', '/new-page.html');

Esto hará que los siguientes hits que se envíen utilicen el nuevo valor. Para registrar una página vista, envía un hit de página vista inmediatamente después de actualizar el objeto de seguimiento.

ga('set', 'page', '/new-page.html');
ga('send', 'pageview');

Aunque técnicamente el comando send de los hits de página vista acepta un campo page opcional como tercer parámetro, no se recomienda pasar el campo page de este modo en el seguimiento de aplicaciones de una sola página. Esto se debe a que los campos que se pasan mediante el comando send no se configuran en el objeto de seguimiento, sino que solo se aplican al hit actual. Si no se actualiza el objeto de seguimiento, pueden producirse problemas si la aplicación envía hits que no sean de página vista (por ejemplo, eventos o interacciones sociales), ya que estos hits se asociarán con cualquier valor de page que tuviera el objeto de seguimiento cuando se creó.

Gestionar varias URL para el mismo recurso

Algunas aplicaciones de una sola página solo actualizan la parte hash de la URL cuando cargan contenido dinámicamente. Esto puede dar lugar a situaciones en las que distintas rutas de página apunten al mismo recurso. En tales casos, lo mejor suele ser elegir una URL canónica y solo enviar ese valor de page a Google Analytics.

Por ejemplo, supongamos que se puede acceder a la página "Acerca de nosotros" de un sitio web mediante cualquiera de estas URL:

  • /about.html
  • /#about.html
  • /home.html#about.html

Para evitar duplicidades en los informes, lo mejor es realizar el seguimiento de estas páginas vistas como /about.html.

Consideraciones importantes

No actualices la URL de referencia del documento

Cuando creas un objeto de seguimiento mediante el comando create, el valor de document.referrer se almacena en el campo referrer del objeto de seguimiento. En el contexto de una aplicación de una sola página que no utiliza cargas de página completa, el campo referrer siempre será el mismo.

A pesar de esto, no es necesario actualizar el campo referrer manualmente antes de enviar los hits de página vista. Google Analytics puede determinar automáticamente la ruta de navegación correcta.

No actualices la ubicación del documento

Igual que el objeto de seguimiento utiliza document.referrer para el campo referrer, usa document.location para el campo location, que puede contener datos de la campaña u otros metadatos en forma de parámetros de consulta agregados al final de la URL.

La actualización de cualquiera de los campos de campaña u otros metadatos que pueda comprobar Google Analytics puede provocar que finalice la sesión actual y que empiece otra. Para evitar este problema, no actualices el campo location al realizar el seguimiento de las páginas vistas virtuales en una aplicación de una sola página. Utiliza el campo page en su lugar.

No crees objetos de seguimiento

No crees nuevos objetos de seguimiento en una aplicación de una sola página para intentar simular lo que hace el fragmento de seguimiento JavaScript en los sitios web tradicionales. Si lo haces, se corre el riesgo de enviar una URL de referencia incorrecta y también datos de campaña incorrectos, tal como se ha descrito anteriormente.