Bắt đầu sử dụng Google Analytics

Hướng dẫn bắt đầu nhanh này sẽ hướng dẫn bạn cách thêm Google Analytics vào ứng dụng và bắt đầu ghi nhật ký sự kiện.

Google Analytics thu thập dữ liệu về mức sử dụng và hành vi cho ứng dụng web của bạn. SDK này ghi lại 2 loại thông tin chính:

  • Sự kiện: Những gì đang xảy ra trong ứng dụng của bạn, chẳng hạn như hành động của người dùng, sự kiện hệ thống hoặc lỗi.

  • Thuộc tính người dùng: Những thuộc tính mà bạn xác định để mô tả các phân khúc cơ sở người dùng, chẳng hạn như lựa chọn ưu tiên về ngôn ngữ hoặc vị trí địa lý.

Analytics tự động ghi lại một số sự kiện và thuộc tính người dùng; bạn không cần thêm mã để bật những sự kiện đó.

Trước khi bắt đầu

Thêm Firebase vào dự án JavaScript và đảm bảo rằng bạn đã bật Google Analytics trong dự án Firebase của mình nếu bạn chưa thực hiện:

  • Nếu bạn đang tạo một dự án Firebase mới, hãy bật Google Analytics trong quy trình tạo dự án.

  • Nếu bạn đang sử dụng một dự án Firebase hiện có nhưng chưa bật Google Analytics, hãy chuyển đến thẻ Tích hợp trong mục > Cài đặt dự án để bật tính năng này.

Khi bạn bật Google Analytics trong dự án của mình, các ứng dụng web trong Firebase sẽ được liên kết với luồng dữ liệu Google Analytics được liên kết với Thuộc tính web và ứng dụng.

Thêm Analytics SDK vào ứng dụng của bạn

Tuỳ thuộc vào cách ứng dụng web được lưu trữ, cấu hình của bạn có thể được xử lý tự động hoặc bạn có thể cần phải cập nhật đối tượng cấu hình Firebase. Nếu ứng dụng web của bạn đã sử dụng Google Analytics, bạn có thể cần phải thiết lập thêm như được mô tả trong bài viết Sử dụng Firebase với tính năng gắn thẻ gtag.js hiện có.

  1. Kiểm tra để đảm bảo rằng đối tượng cấu hình Firebase trong mã của bạn có chứa measurementId. Mã này được tạo tự động khi bạn bật Analytics trong dự án Firebase và đăng ký một ứng dụng web. Bạn bắt buộc phải có mã này để sử dụng Analytics.

    • Nếu ứng dụng của bạn sử dụng tính năng Lưu trữ Firebase và sử dụng URL đặt trước cho Firebase SDK:

      Firebase tự động xử lý việc định cấu hình ứng dụng của bạn. Để hoàn tất quá trình thiết lập, hãy thêm tập lệnh từ thẻ Ứng dụng của bạn trong phần Cài đặt dự án vào thẻ <body> của ứng dụng (nếu bạn chưa thêm).

    • Nếu ứng dụng của bạn không dùng URL đặt trước: Nếu bạn đang làm việc với một ứng dụng web hiện có, hãy cập nhật đối tượng cấu hình Firebase trong mã của bạn để đảm bảo trường measurementId xuất hiện. Đối tượng cấu hình sẽ có dạng như trong ví dụ sau:

      // 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. Cài đặt Firebase JS SDK và khởi chạy Firebase nếu bạn chưa thực hiện.

  3. Thêm Analytics JS SDK và khởi chạy Analytics:

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

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

Sử dụng Firebase với tính năng gắn thẻ gtag.js hiện tại

Nếu trước đó bạn đã từng chạy Google Analytics trong ứng dụng bằng cách sử dụng đoạn mã gtag.js, thì ứng dụng của bạn có thể yêu cầu thiết lập thêm nếu bạn định thực hiện một trong những thao tác sau:

  • Thêm các lệnh gọi Google Analytics từ Firebase vào trang, đồng thời dự định tiếp tục sử dụng các lệnh gọi gtag() ngay trên cùng một trang.
  • Muốn sử dụng cùng một mã đo lường giữa cả lệnh gọi gtag() trực tiếp và dữ liệu Google Analytics được gửi đến Firebase.

Để đảm bảo tất cả dịch vụ Firebase đều có thể sử dụng các sự kiện của bạn, hãy hoàn tất các bước thiết lập bổ sung sau đây:

  • Xóa dòng gtag('config', 'GA_MEASUREMENT_ID');, trong đó GA_MEASUREMENT_ID là measurementId của ứng dụng web Firebase. Nếu có các mã nhận dạng khác cho các tài sản Analytics khác trên trang này, bạn không cần phải xoá dòng cấu hình của các tài sản đó.
  • Hãy nhớ gọi firebase.analytics() trước khi gửi bất kỳ sự kiện nào bằng gtag().

Nếu không, các sự kiện được gửi đến mã nhận dạng đó bằng lệnh gọi gtag() sẽ không được liên kết với Firebase và sẽ không dùng được để nhắm mục tiêu trong các dịch vụ Firebase khác.

Bắt đầu ghi nhật ký sự kiện

Sau khi khởi chạy dịch vụ Analytics, bạn có thể bắt đầu ghi lại các sự kiện bằng phương thức logEvent().

Có một số sự kiện được đề xuất cho tất cả ứng dụng; một số sự kiện khác được đề xuất cho các loại hình kinh doanh hoặc ngành dọc cụ thể. Bạn nên gửi các sự kiện được đề xuất cùng với các tham số được quy định của các sự kiện đó để đảm bảo số lượng thông tin chi tiết tối đa trong báo cáo và hưởng lợi từ các tính năng và nội dung tích hợp trong tương lai khi chúng ra mắt. Phần này minh hoạ việc ghi nhật ký một sự kiện được xác định trước. Để biết thêm thông tin về cách ghi nhật ký các sự kiện, hãy xem bài viết Ghi nhật ký sự kiện.

Ví dụ sau minh hoạ cách ghi lại một sự kiện được đề xuất để cho biết người dùng đã nhận được thông báo trong ứng dụng của bạn:

Web

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

const analytics = getAnalytics();
logEvent(analytics, 'notification_received');
analytics_log_event.js

Web

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

Các bước tiếp theo