Catch up on everything announced at Firebase Summit, and learn how Firebase can help you accelerate app development and run your app with confidence. Learn More

Comience con Google Analytics

Organiza tus páginas con colecciones Guarda y categoriza el contenido según tus preferencias.

Este inicio rápido le muestra cómo agregar Google Analytics a su aplicación y comenzar a registrar eventos.

Google Analytics recopila datos de uso y comportamiento de su aplicación web. El SDK registra dos tipos principales de información:

  • Eventos : lo que sucede en su aplicación, como acciones del usuario, eventos del sistema o errores.

  • Propiedades de usuario : atributos que define para describir segmentos de su base de usuarios, como la preferencia de idioma o la ubicación geográfica.

Analytics registra automáticamente algunos eventos y propiedades de usuario ; no necesita agregar ningún código para habilitarlos.

Antes de que empieces

Si aún no lo ha hecho, agregue Firebase a su proyecto de JavaScript y asegúrese de que Google Analytics esté habilitado en su proyecto de Firebase:

  • Si está creando un nuevo proyecto de Firebase, habilite Google Analytics durante el flujo de trabajo de creación del proyecto.

  • Si está utilizando un proyecto de Firebase existente que no tiene habilitado Google Analytics, vaya a la pestaña Integraciones de su > Configuración del proyecto para habilitarlo.

Cuando habilita Google Analytics en su proyecto, sus aplicaciones web de Firebase se vinculan a los flujos de datos de Google Analytics asociados con una propiedad App + Web .

Agregue el SDK de Analytics a su aplicación

Dependiendo de cómo se aloje su aplicación web, su configuración puede manejarse automáticamente o puede necesitar actualizar su objeto de configuración de Firebase . Si su aplicación web ya usa Google Analytics, es posible que deba realizar una configuración adicional descrita en Usar Firebase con el etiquetado gtag.js existente .

  1. Verifique que su objeto de configuración de Firebase en su código contenga measurementId . Este ID se crea automáticamente cuando habilita Analytics en su proyecto de Firebase y registra una aplicación web, y es necesario para usar Analytics.

    • Si su aplicación usa Firebase Hosting y usa URL reservadas para los SDK de Firebase :

      Firebase maneja automáticamente la configuración de su aplicación. Para completar la configuración, agregue los scripts de la tarjeta Sus aplicaciones en la configuración de su Proyecto a la etiqueta <body> de su aplicación, si aún no lo ha hecho.

    • Si su aplicación no usa URL reservadas : si está trabajando con una aplicación web existente , actualice el objeto de configuración de Firebase en su código para asegurarse de que el campo de measurementId Id esté presente. El objeto de configuración debería ser similar al siguiente ejemplo:

      // For Firebase JavaScript SDK v7.20.0 and later, `measurementId` is an optional field
      const firebaseConfig = {
        apiKey: "AIzaSyCGQ0tYppWFJkuSxBhOpkH0xVDmX245Vdc",
        authDomain: "project-id.firebaseapp.com",
        databaseURL: "https://project-id.firebaseio.com",
        projectId: "project-id",
        storageBucket: "project-id.appspot.com",
        messagingSenderId: "637908496727",
        appId: "2:637908496727:web:a4284b4c99e329d5",
        measurementId: "G-9VP01NDSXJ"
      };
      
  2. Si aún no lo ha hecho, instale el SDK de Firebase JS e inicialice Firebase .

  3. Agregue el SDK de Analytics JS e inicialice Analytics:

Web version 9

import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);


// Initialize Analytics and get a reference to the service
const analytics = getAnalytics(app);

Web version 8

import firebase from "firebase/app";
import "firebase/analytics";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);


// Initialize Analytics and get a reference to the service
const analytics = firebase.analytics();

Use Firebase con el etiquetado gtag.js existente

Si anteriormente tenía Google Analytics ejecutándose en su aplicación mediante el fragmento gtag.js , su aplicación puede requerir una configuración adicional si planea hacer una de las siguientes cosas:

  • Agregue llamadas de Google Analytics desde Firebase a la página, pero también planee continuar usando llamadas de gtag() directamente en la misma página.
  • Desea utilizar el mismo ID de medición entre las llamadas directas gtag() y los datos de Google Analytics enviados a Firebase.

Para asegurarse de que sus eventos estén disponibles para que los usen todos los servicios de Firebase, complete los siguientes pasos de configuración adicionales:

  • Elimina la línea gtag('config', ' GA_MEASUREMENT_ID '); donde GA_MEASUREMENT_ID es el ID de measurementId de su aplicación web de Firebase. Si tiene otros ID para otras propiedades de Analytics en la página, no es necesario que elimine su línea de configuración.
  • Asegúrate de llamar a firebase.analytics() antes de enviar cualquier evento con gtag() .

De lo contrario, los eventos enviados a ese ID con llamadas gtag() no se asociarán con Firebase y no estarán disponibles para la orientación en otros servicios de Firebase.

Empezar a registrar eventos

Una vez que haya inicializado el servicio de Analytics , puede comenzar a registrar eventos con el método logEvent() .

Se recomiendan ciertos eventos para todas las aplicaciones ; otros se recomiendan para tipos de negocios o verticales específicos. Debe enviar eventos sugeridos junto con sus parámetros prescritos, para garantizar el máximo detalle disponible en sus informes y beneficiarse de futuras funciones e integraciones a medida que estén disponibles. Esta sección demuestra el registro de un evento predefinido. Para obtener más información sobre el registro de eventos, consulte Eventos de registro .

El siguiente ejemplo muestra cómo registrar un evento recomendado para indicar que un usuario recibió una notificación en su aplicación:

Web version 9

import { getAnalytics, logEvent } from "firebase/analytics";

const analytics = getAnalytics();
logEvent(analytics, 'notification_received');

Web version 8

firebase.analytics().logEvent('notification_received');

Próximos pasos