使用 Google Analytics 自訂事件和 Flutter 推出 Google Ads 廣告活動

1. 簡介

上次更新時間：2021 年 1 月 25 日

建構項目

在本程式碼研究室中，您將瞭解如何使用 GA4F 導入自訂事件，並透過 Google Ads 推出 Flutter 應用程式的行動廣告活動。

我們會使用預設的 Flutter 應用程式，搭配簡單的計數器小工具。我們會向潛在使用者宣傳應用程式，他們很可能會點選計數器小工具。

課程內容

• 如何在 Flutter 中初始化 GA4F (Google Analytics for Firebase)
• 如何建立自訂事件和參數
• 如何將事件從 Firebase 匯入 Google Ads
• 如何使用自訂事件發起動作廣告活動

軟硬體需求

• Android Studio 3.6 以上版本
• Xcode (支援 iOS)
• Firebase 帳戶
• Google Ads 帳戶

2. 啟動新的 Flutter 專案

建立簡單的範本 Flutter 應用程式。您將在本程式碼研究室中修改這個入門應用程式。

啟動 Android Studio。

注意：如果 IDE 中沒有「New Flutter Project」選項，請確認您已安裝 Flutter 和 Dart 的外掛程式。

1. 如果沒有開啟的專案，請從歡迎頁面選取「Start a new Flutter app」。否則，請依序選取「File」>「New」>「New Flutter Project」。
2. 選取「Flutter Application」做為專案類型，然後按一下「Next」。
3. 確認 Flutter SDK 路徑指定 SDK 的位置。(如果文字欄位空白，請選取「Install SDK」)。
4. 輸入專案名稱，然後按一下「下一步」。
5. 使用 Android Studio 建議的預設套件名稱，然後按一下「下一步」。
6. 按一下「完成」。
7. 等待 Android Studio 安裝 SDK 並建立專案。

3. 建立及設定 Firebase 專案

如要開始使用 Firebase，請建立及設定 Firebase 專案。

建立 Firebase 專案

1. 登入 Firebase。

在 Firebase 控制台中，按一下「新增專案」(或「建立專案」)，然後將 Firebase 專案命名為 Firebase-Flutter-Ads 或任何您喜歡的名稱。

2. 點選專案建立選項。當系統顯示提示時，請接受 Firebase 條款。您需要 Google Analytics 事件來追蹤動作事件及分析轉換，因此請為這個專案啟用 Google Analytics。

如要進一步瞭解 Firebase 專案，請參閱「瞭解 Firebase 專案」一文。

4. 平台專屬 Firebase 設定 (Android)

設定 Android

1. 在 Firebase 控制台中，選取左側導覽列中的「專案總覽」，然後按一下「將 Firebase 新增至應用程式即可開始使用」下方的「Android」按鈕。

您會看到下圖所示的對話方塊。

2. 您必須提供 Android 套件名稱，這項值可透過下列步驟取得。

提示：如要進一步瞭解套件和應用程式 ID，請參閱「設定應用程式 ID」。

3. 在 Flutter 應用程式目錄中，開啟 android/app/src/main/AndroidManifest.xml 檔案。
4. 在 manifest 元素中，找出 package 屬性的字串值。這個值是 Android 套件名稱 (類似 com.yourcompany.yourproject)。請複製這個值。
5. 在 Firebase 對話方塊中，將複製的套件名稱貼到 Android package name 欄位。
6. 除非您打算使用 Google 登入或 Firebase Dynamic Links (請注意，這些並非本程式碼研究室的一部分)，否則這裡不需要 SHA-1 金鑰。如果您打算從 Google Play 匯入 in_app_purchase 資料，則必須稍後再設定金鑰。
7. 按一下「Register App」(註冊應用程式)。
8. 繼續在 Firebase 中操作，按照指示下載設定檔 google-services.json。

9. 前往 Flutter 應用程式目錄，然後將剛下載的 google-services.json 檔案移到 android/app 目錄。
10. 返回 Firebase 控制台，略過其餘步驟，然後返回 Firebase 控制台主頁面。
11. 最後，您需要 Google 服務 Gradle 外掛程式，才能讀取 Firebase 產生的 google-services.json 檔案。
12. 在 IDE 或編輯器中開啟 android/app/build.gradle，然後在檔案中最後一行加入下列程式碼：

apply plugin: 'com.google.gms.google-services'

13. 開啟 android/build.gradle，然後在 buildscript 標記內新增依附元件：

buildscript { 
   repositories {
      // ...
   }
   dependencies {
      // ...
      Classpath 'com.google.gms:google-services:4.3.3'
   }
}

14. 如果應用程式仍在執行中，請關閉並重建應用程式，讓 Gradle 安裝依附元件。

您已完成 Android 適用的 Flutter 應用程式設定！如果是 iOS，建議參閱這項程式碼研究室 ( 認識適用於 Flutter 的 Firebase)

5. 在 Flutter 中設定 Firebase Analytics

在這個步驟中，您會開始使用名為 firebase_analytics 的 Firebase Analytics 套件，其中包含 Firebase Analytics 功能。

pubspec 檔案會管理 Flutter 應用程式的資產。在 pubspec.yaml 中，將 firebase_analytics: ^6.2.0 (firebase_analytics 6.2.0 以上版本) 附加至依附元件清單：

dependencies: 
   flutter: 
      sdk: flutter 
   cupertino_icons: ^0.1.2 
   firebase_analytics: ^6.2.0   # add this line

在 Android Studio 的編輯器檢視畫面中查看 pubspec 時，按一下「Packages get」。這會將套件拉進專案。控制台應會顯示下列內容：

flutter packages get 
Running "flutter packages get" in startup_namer... 
Process finished with exit code 0

執行 Pub get 時，系統也會自動產生 pubspec.lock 檔案，其中列出專案中提取的所有套件及其版本號碼。

注意：對於特定 Firebase 版本，首次初始化 FirebaseAnalytics 類別時會顯示 java.lang.IllegalArgumentException: Service not registered (請參閱 github 問題 1662).

在 lib/main.dart 中，匯入新套件：

import 'package:firebase_analytics/firebase_analytics.dart';

在 MyApp 類別中，呼叫建構函式來啟動 FirebaseAnalytics 物件。

class MyApp extends StatelessWidget {
 static FirebaseAnalytics analytics = FirebaseAnalytics();
   ...
}

現在可以開始觸發一些自訂事件記錄了！

6. 使用 Firebase Analytics 記錄自訂事件

如果您要在 Flutter 應用程式中產生新範本，會看到 _counter 變數，以及預設 State 類別中的 _incrementCounter() 方法。現在，您希望在過於熱情的使用者點選遞增按鈕超過五次時，記錄自訂事件。稍後，我們將推出應用程式廣告活動，吸引潛在的熱衷使用者

首先，我們要將已初始化的分析物件傳遞至 Stateful 小工具。首先，我們會在 MyHomePage 建構函式中新增 Analytics 參數。

MyHomePage({Key key, this.title, this.analytics}) : super(key: key);

呼叫建構函式時，您也會新增數據分析參數。

home: MyHomePage(
   title: 'Flutter Demo Home Page',
   analytics: analytics,
),

現在，您可以使用 logEvent() 方法輕鬆記錄事件。新增方法並遞增 _counter 變數。

void _incrementCounter() {
 setState(() {
   _counter++;

   //add this
   if(_counter > 5) { 
     widget.analytics.logEvent(name: "clicked_counter"); 
   }

 });
}

現在，您的應用程式已可觸發自訂事件記錄！

您也可以使用預先建構的方法觸發事件。

現在一切就緒，在 Android Studio 中執行「main.dart」。

(選用) 使用參數將其他資訊傳送至 Firebase Analytics

您可以透過參數傳送其他資訊。自訂參數可登記在 Analytics 報表中。此外，您也可以在目標對象定義中將這些屬性做為篩選器，並套用至各項報表。如果應用程式已連結至 BigQuery 專案，您也可以在 BigQuery 中找到自訂參數 (請參閱「Firebase 的 BigQuery Export」)。

我們在這裡將 _counter 值設為參數。

void _incrementCounter() {
 setState(() {
   _counter++;

   if(_counter > 5) {
     widget.analytics.logEvent(name: "clicked_counter", parameters: {'count' : _counter});
   }
 });
}

檢查及偵錯事件

過幾小時後，您就能在 Firebase 控制台看到記錄的事件。只要在 Firebase 控制台的「Analytics」部分中，按一下「事件」分頁標籤，您也可以點選事件，查看事件 clicked_counter 內的值。

將「標示為轉換」切換鈕滑到右側，將 clicked_counter 標示為轉換。

如果事件顯示在「轉換」分頁中，表示您已成功將事件標示為轉換。Google Ads 現在可以從 Firebase 匯入這項事件。

如要進行偵錯，請使用 Firebase DebugView。詳情請參閱「偵錯事件」。

7. 在 Google Ads 中匯入 Analytics 事件

完成 Firebase-Flutter 設定後，即可放送以動作事件為目標的應用程式廣告活動。首先，請將 Firebase 連結至 Google Ads。將 Firebase 連結至 Google Ads 後，應用程式廣告活動就能匯入 Firebase 事件。此外，Google Ads 也能藉此進一步瞭解目標對象，進而提升應用程式廣告活動成效。

1. 按一下「專案總覽」旁的按鈕，前往 Firebase 設定。
2. 在「整合」分頁中，您會看到「Google Ads」和「連結」按鈕。依序點選「連結」和「繼續」。

3. 選擇 Google Ads 帳戶。

注意：如果目標事件未標示為轉換事件，Google Ads 就無法匯入。確認事件已正確標示為轉換。

Firebase 部分已完成。

前往 Google Ads。

1. 登入帳戶，然後依序前往「工具與設定」>「評估」>「轉換」，匯入自訂事件做為轉換。
2. 按一下「+」按鈕，新增轉換動作。

3. 選擇「Google Analytics 4 資源 (Firebase)」，然後按一下「繼續」。

4. 您可以查看所有標示為轉換的 Analytics 事件。找出我們先前導入的 clicked_counter 事件。

5. 勾選動作，然後依序點選「匯入」和「繼續」。

將 clicked_counter 設為轉換動作後，您就能放送動作廣告活動，指定可能會觸發 clicked_counter 事件超過 5 次的使用者。

8. 使用匯入的事件放送應用程式動作廣告活動

重要事項：如要順利推出應用程式廣告活動，您必須在 Google Play 中取得正式版應用程式。不過，如果還沒準備好發布，可以暫時略過這個步驟。

6. 前往目前帳戶的廣告活動分頁，然後按一下「+」按鈕，開始建立新的廣告活動。按一下「[新廣告活動]」，然後按一下「繼續」。
7. 使用「應用程式安裝」選項，推出應用程式宣傳廣告活動。

8. 輸入應用程式名稱、套件名稱或發布商，即可找到應用程式。
9. 在「出價」部分，從下拉式選單中選取「應用程式內動作」。
10. 在提供的清單中找出自訂事件。設定目標單次動作出價，並完成任何其他選項。

11. 完成廣告活動設定。

9. 恭喜

恭喜，您已成功整合 Firebase 和 Google Ads！這有助於您透過 Firebase 匯入的事件，提升廣告活動成效。

您已學習以下內容

• 如何為 Flutter 設定 Firebase Analytics
• 如何在 Flutter 應用程式中，使用 Firebase Analytics 記錄自訂事件。
• 如何匯入事件，並用於動作廣告活動。