Catch up on highlights from Firebase at Google I/O 2023. Learn more

เริ่มต้นใช้งาน Google Analytics

การเริ่มต้นอย่างรวดเร็วนี้แสดงวิธีเพิ่ม Google Analytics ลงในแอปของคุณและเริ่มบันทึกกิจกรรมต่างๆ

Google Analytics รวบรวมข้อมูลการใช้งานและพฤติกรรมสำหรับเว็บแอปของคุณ SDK จะบันทึกข้อมูลหลักสองประเภท:

  • เหตุการณ์ : สิ่งที่เกิดขึ้นในแอปของคุณ เช่น การกระทำของผู้ใช้ เหตุการณ์ของระบบ หรือข้อผิดพลาด

  • พร็อพเพอร์ตี้ผู้ใช้ : แอตทริบิวต์ที่คุณกำหนดเพื่ออธิบายกลุ่มฐานผู้ใช้ของคุณ เช่น การตั้งค่าภาษาหรือตำแหน่งที่ตั้งทางภูมิศาสตร์

Analytics จะบันทึก เหตุการณ์ และ พร็อพเพอร์ตี้ผู้ใช้ บางอย่างโดยอัตโนมัติ คุณไม่จำเป็นต้องเพิ่มรหัสใด ๆ เพื่อเปิดใช้งาน

ก่อนที่คุณจะเริ่มต้น

หากคุณยังไม่ได้ ดำเนินการ ให้เพิ่ม Firebase ในโครงการ JavaScript ของคุณ และตรวจสอบให้แน่ใจว่าเปิดใช้งาน Google Analytics ในโครงการ Firebase ของคุณ:

  • หากคุณกำลังสร้างโปรเจ็กต์ Firebase ใหม่ ให้เปิดใช้ Google Analytics ระหว่างเวิร์กโฟลว์การสร้างโปรเจ็กต์

  • หากคุณใช้โปรเจ็กต์ Firebase ที่มีอยู่ซึ่งไม่ได้เปิดใช้ Google Analytics ให้ไปที่แท็บ การผสานรวม ของ > การตั้งค่าโปรเจ็กต์ เพื่อเปิดใช้

เมื่อคุณเปิดใช้ Google Analytics ในโครงการของคุณ เว็บแอป Firebase จะลิงก์กับสตรีมข้อมูล Google Analytics ที่เชื่อมโยงกับ พร็อพเพอร์ตี้แอป + เว็บ

เพิ่ม Analytics SDK ลงในแอปของคุณ

ขึ้นอยู่กับวิธีการโฮสต์เว็บแอปพลิเคชันของคุณ การกำหนดค่าของคุณอาจได้รับการจัดการโดยอัตโนมัติ หรือคุณอาจต้องอัปเดตอ อบเจกต์การกำหนดค่า Firebase หากเว็บแอปของคุณใช้ Google Analytics อยู่แล้ว คุณอาจต้องตั้งค่าเพิ่มเติมตามที่อธิบายไว้ใน ใช้ Firebase กับการติดแท็ก gtag.js ที่มีอยู่

  1. ตรวจสอบว่าออบเจ measurementId ต์การกำหนดค่า Firebase ในโค้ดของคุณมี รหัสนี้สร้างขึ้นโดยอัตโนมัติเมื่อคุณเปิดใช้ Analytics ในโครงการ Firebase และลงทะเบียนเว็บแอป และรหัสนี้จำเป็นต้องใช้ Analytics

    • หากแอปของคุณใช้โฮสติ้งของ Firebase และ ใช้ URL ที่สงวนไว้ สำหรับ Firebase SDK :

      Firebase จะจัดการการกำหนดค่าแอปพลิเคชันของคุณโดยอัตโนมัติ หากต้องการตั้งค่าให้เสร็จสมบูรณ์ ให้เพิ่มสคริปต์จากการ์ด แอปของคุณ ใน การตั้งค่าโครงการ ไปที่แท็ก <body> ของแอป หากยังไม่ได้ดำเนินการ

    • หากแอปของคุณไม่ได้ใช้ URL ที่สงวนไว้ : หากคุณกำลังทำงานกับเว็บแอปที่มีอยู่ ให้อัปเดตออบเจ็กต์การกำหนด measurementId Firebase ในโค้ดเพื่อให้แน่ใจว่ามีช่อง ออบเจกต์ config ควรมีลักษณะคล้ายกับตัวอย่างต่อไปนี้:

      // 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. หากคุณยังไม่ได้ ติดตั้ง ให้ติดตั้ง Firebase JS SDK และเริ่มต้น Firebase

  3. เพิ่ม Analytics JS SDK และเริ่มต้น Analytics:

เว็บโมดูลาร์ API

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 เนมสเปซของเว็บ

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

ใช้ Firebase กับการติดแท็ก gtag.js ที่มีอยู่

หากก่อนหน้านี้คุณมี Google Analytics ทำงานในแอปโดยใช้ ข้อมูลโค้ด gtag.js แอปของคุณอาจต้องมีการตั้งค่าเพิ่มเติมหากคุณวางแผนที่จะดำเนินการอย่างใดอย่างหนึ่งต่อไปนี้

  • เพิ่มการเรียก Google Analytics จาก Firebase ไปที่หน้า แต่ยังวางแผนที่จะใช้การเรียก gtag() ต่อโดยตรงในหน้าเดียวกัน
  • ต้องการใช้รหัสการวัดเดียวกันระหว่างการเรียก gtag() โดยตรงและข้อมูล Google Analytics ที่ส่งไปยัง Firebase

เพื่อให้แน่ใจว่ากิจกรรมของคุณพร้อมใช้งานโดยบริการ Firebase ทั้งหมด ให้ทำตามขั้นตอนการตั้งค่าเพิ่มเติมต่อไปนี้:

  • ลบบรรทัด gtag('config', ' GA_MEASUREMENT_ID '); โดยที่ GA_MEASUREMENT_ID คือ measurementId ของเว็บแอป Firebase ของคุณ หากคุณมี ID อื่นสำหรับพร็อพเพอร์ตี้ Analytics อื่นๆ ในหน้า คุณไม่จำเป็นต้องลบบรรทัดการกำหนดค่าออก
  • อย่าลืมเรียก firebase.analytics() ก่อนส่งกิจกรรมด้วย gtag()

มิฉะนั้น เหตุการณ์ที่ส่งไปยัง ID นั้นด้วยการเรียก gtag() จะไม่เชื่อมโยงกับ Firebase และจะใช้ไม่ได้สำหรับการกำหนดเป้าหมายในบริการ Firebase อื่นๆ

เริ่มบันทึกเหตุการณ์

หลังจากที่คุณเริ่มต้น บริการ Analytics แล้ว คุณสามารถเริ่มบันทึกเหตุการณ์ด้วยเมธอด logEvent()

แนะนำให้ใช้เหตุการณ์บางอย่างสำหรับแอปทั้งหมด ส่วนอื่นๆ แนะนำสำหรับประเภทธุรกิจหรือประเภทธุรกิจเฉพาะ คุณควรส่งเหตุการณ์ที่แนะนำไปพร้อมกับพารามิเตอร์ที่กำหนดเพื่อให้แน่ใจว่ามีรายละเอียดสูงสุดในรายงานของคุณ และเพื่อรับประโยชน์จากคุณสมบัติและการผสานรวมในอนาคตเมื่อพร้อมใช้งาน ส่วนนี้สาธิตการบันทึกเหตุการณ์ที่กำหนดไว้ล่วงหน้า สำหรับข้อมูลเพิ่มเติมเกี่ยวกับเหตุการณ์การบันทึก โปรดดูที่ บันทึกเหตุการณ์

ตัวอย่างต่อไปนี้สาธิตวิธีบันทึกเหตุการณ์ที่แนะนำเพื่อระบุว่าผู้ใช้ได้รับการแจ้งเตือนในแอปของคุณ:

Web modular API

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

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

Web namespaced API

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

ขั้นตอนถัดไป