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

Chọn nền tảng: iOS+ Android Web Flutter Unity C++

Hướng dẫn nhanh này sẽ chỉ cho 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 ghi nhật ký hai loại thông tin chính:

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

  • Thuộc tính người dùng: Các thuộc tính mà bạn xác định để mô tả các phân khúc trong 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 sẽ tự động ghi nhật ký một số sự kiện và thuộc tính người dùng. Bạn không cần thêm mã nào để bật những sự kiện và thuộc tính này.

Trước khi bắt đầu

Nếu bạn chưa thực hiện, hãy thêm Firebase vào dự án JavaScript và đảm bảo rằng Google Analytics đã được bật trong dự án Firebase:

  • Nếu bạn đang tạo 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ó chưa bật Google Analytics hãy chuyển đến thẻ Tích hợp trong phần > Cài đặt dự án để bật.

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

Thêm SDK Analytics vào ứng dụng

Tuỳ thuộc vào cách lưu trữ ứng dụng web, cấu hình của bạn có thể được xử lý tự động hoặc bạn có thể cần 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, thì bạn có thể cần thực hiện thêm bước thiết lập được mô tả trong phần Sử dụng Firebase với phương pháp gắn thẻ gtag.js hiện có.

  1. Kiểm tra để đảm bảo đố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 cần có mã này để sử dụng Analytics.

    • Nếu ứng dụng của bạn sử dụng Firebase Hosting và sử dụng URL dành riêng cho SDK Firebase:

      Firebase sẽ tự động xử lý việc định cấu hình ứng dụng. Để hoàn tất quá trình thiết lập, hãy thêm các 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ực hiện).

    • Nếu ứng dụng của bạn không sử dụng URL dành riêng: 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ã để đảm bảo trường measurementId xuất hiện. Đối tượng cấu hình sẽ có dạng như ví dụ sau:

      // For Firebase JavaScript SDK v7.20.0 and later, `measurementId` is an optional field
const firebaseConfig = {
  apiKey: "API_KEY",
  authDomain: "PROJECT_ID.firebaseapp.com",
  databaseURL: "https://PROJECT_ID.firebaseio.com",
  projectId: "PROJECT_ID",
  storageBucket: "PROJECT_ID.firebasestorage.app",
  messagingSenderId: "SENDER_ID",
  appId: "APP_ID",
  measurementId: "G-GA_MEASUREMENT_ID"
};
      1. Nếu bạn chưa thực hiện, hãy cài đặt SDK Firebase JS và khởi chạy Firebase. 2. Thêm SDK JS Analytics 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 phương pháp gắn thẻ gtag.js hiện có

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

  • Thêm Google Analytics lệnh gọi từ Firebase vào trang nhưng cũng dự định tiếp tục sử dụng gtag() lệnh gọi trực tiếp 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à Google Analytics dữ liệu được gửi đến Firebase.

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

  • Xoá 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ã khác cho các thuộc tính Analytics khác trên trang, bạn không cần xoá dòng cấu hình của các mã đó.
  • Đảm bảo bạn 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ã đó bằng lệnh gọi gtag() sẽ không được liên kết với Firebase và sẽ không có sẵn để nhắm mục tiêu trong các dịch vụ khác của Firebase.

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 nhật ký 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; trong khi 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 cho sự kiện đó để đảm bảo báo cáo có được thông tin chi tiết tối đa, đồng thời hưởng lợi từ các tính năng và công cụ tích hợp sẽ ra mắt trong tương lai. Phần này minh hoạ cách 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ý sự kiện, hãy xem bài viết Ghi nhật ký sự kiện.

Ví dụ sau đây minh hoạ cách ghi nhật ký 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:

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