Comece a usar o Google Analytics

Este guia de início rápido mostra como adicionar o Google Analytics ao seu aplicativo e começar a registrar eventos.

O Google Analytics coleta dados de uso e comportamento do seu aplicativo da web. O SDK registra dois tipos principais de informações:

  • Eventos : o que está acontecendo no seu aplicativo, como ações do usuário, eventos do sistema ou erros.

  • Propriedades do usuário : atributos que você define para descrever segmentos da sua base de usuários, como preferência de idioma ou localização geográfica.

O Analytics registra automaticamente alguns eventos e propriedades do usuário ; você não precisa adicionar nenhum código para ativá-los.

Antes de você começar

Adicione o Firebase ao seu projeto JavaScript , caso ainda não o tenha feito, e certifique-se de que o Google Analytics esteja ativado no seu projeto do Firebase:

  • Se você estiver criando um novo projeto do Firebase, ative o Google Analytics durante o fluxo de trabalho de criação do projeto.

  • Se você estiver usando um projeto existente do Firebase que não tenha o Google Analytics ativado, acesse a guia Integrações do seu > Configurações do projeto para habilitá-lo.

Quando você ativa o Google Analytics em seu projeto, seus aplicativos Web do Firebase são vinculados a fluxos de dados do Google Analytics associados a uma propriedade App + Web .

Adicione o SDK do Analytics ao seu aplicativo

Dependendo de como seu aplicativo Web está hospedado, sua configuração pode ser tratada automaticamente ou pode ser necessário atualizar seu objeto de configuração do Firebase . Se seu aplicativo da web já usa o Google Analytics, talvez seja necessário fazer configurações adicionais descritas em Usar o Firebase com tags gtag.js existentes .

  1. Verifique se o objeto de configuração do Firebase no seu código contém measurementId . Esse ID é criado automaticamente quando você ativa o Analytics em seu projeto do Firebase e registra um aplicativo da Web, e é necessário para usar o Analytics.

    • Se seu aplicativo usa o Firebase Hosting e URLs reservados para os SDKs do Firebase :

      O Firebase cuida automaticamente da configuração do seu aplicativo. Para concluir a configuração, adicione os scripts do cartão Seus aplicativos nas configurações do projeto à tag <body> do seu aplicativo, caso ainda não tenha feito isso.

    • Se seu aplicativo não usa URLs reservados : se você estiver trabalhando com um aplicativo Web existente , atualize o objeto de configuração do Firebase em seu código para garantir que o campo measurementId esteja presente. O objeto de configuração deve ser semelhante ao exemplo a seguir:

      // 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. Se ainda não o fez, instale o Firebase JS SDK e inicialize o Firebase .

  3. Adicione o SDK JS do Analytics e inicialize o Analytics:

API modular da Web

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);

API com namespace da Web

import firebase from "firebase/compat/app";
import "firebase/compat/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();

Usar o Firebase com tags gtag.js existentes

Se você já tinha o Google Analytics em execução no seu aplicativo usando o snippet gtag.js , seu aplicativo poderá exigir configuração adicional se você planeja fazer o seguinte:

  • Adicione chamadas do Google Analytics do Firebase à página, mas também planeje continuar usando chamadas gtag() diretamente na mesma página.
  • Deseja usar o mesmo ID de medição entre chamadas diretas gtag() e dados do Google Analytics enviados ao Firebase.

Para garantir que seus eventos estejam disponíveis para uso por todos os serviços do Firebase, conclua as seguintes etapas adicionais de configuração:

  • Remova a linha gtag('config', ' GA_MEASUREMENT_ID '); onde GA_MEASUREMENT_ID é o measurementId do seu aplicativo da web do Firebase. Se você tiver outros IDs para outras propriedades do Analytics na página, não será necessário remover a linha de configuração.
  • Certifique-se de chamar firebase.analytics() antes de enviar qualquer evento com gtag() .

Caso contrário, os eventos enviados para esse ID com chamadas gtag() não serão associados ao Firebase e não estarão disponíveis para segmentação em outros serviços do Firebase.

Comece a registrar eventos

Depois de inicializar o serviço Analytics , você poderá começar a registrar eventos com o método logEvent() .

Certos eventos são recomendados para todos os aplicativos ; outros são recomendados para tipos de negócios ou setores específicos. Você deve enviar eventos sugeridos junto com seus parâmetros prescritos, para garantir o máximo de detalhes disponíveis em seus relatórios e para se beneficiar de recursos e integrações futuras assim que estiverem disponíveis. Esta seção demonstra o registro de um evento predefinido. Para obter mais informações sobre o registro de eventos, consulte Registrar eventos .

O exemplo a seguir demonstra como registrar um evento recomendado para indicar que um usuário recebeu uma notificação no seu aplicativo:

Web modular API

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

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

Web namespaced API

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

Próximos passos