Zenn
✍️

【Flutter】Firebaseで ログ実装の薄いラッパークラス

2024/01/25に公開
Firebase
Flutter
analytics
log
ログ
tech

概要

Flutterアプリで、FirebaseAnalyticsを使う際にそのまま使わず、薄くラッパークラスをつくる。

下記のように呼び出して利用するイメージ

Analytics.sendEvent(event: AnalyticsEvent.Tutorial_start);

Event名をEnumで管理したかった。

サンプルコードの内容について

詳細な分析をするというよりは、とりあえず導入しておいて、利用具合を把握、というレベル感の内容です。

個人開発で「特定の機能」の利用具合をみる、ぐらいであれば、Firebaseの管理画面で確認できます。
（より詳細分析するには、「BigQuery」を叩く必要があるし、それようにログ設計をきちんと行う必要があると思います。）

管理画面での見え方

イベント名とその数、はみれます。
※イベント名に任意のパラメータ付与した場合は、現状は管理画面ではみえない。
（BigQuery使う必要が出てくる、と思います。）

注意点

FirebaseのAnalyticsは、イベント名の数に上限があったり、等の細かな制約があります。
最新仕様は、公式サイトで確認が必要です。

https://firebase.google.com/docs/analytics/events?hl=ja&platform=flutter

実装

実装内容は、チュートリアル動線の離脱率をみたいケースの実装です。
「開始 -> 1ページ目 -> 2ページ目 -> 3ページ目 -> 終了」
のそれぞれのタイミングで、ログ投げて、チュートリアルの離脱具合がわかればOK,というような内容です。

  • Analyticsクラスを定義
  • イベント名を、Enumで管理
// 独自のカスタムイベントを定義
enum AnalyticsEvent {
  DebugDemoCustomLog, // test

  Tutorial_start, // チュートリアル開始時
  Tutorial_1,     // チュートリアルページ1の「決定」タップ時
  Tutorial_2,     // チュートリアルページ2の「決定」タップ時
  Tutorial_3,     // チュートリアルページ3の「決定」タップ時  
  Tutorial_end,   // チュートリアル終了時
}

class Analytics {
  static final FirebaseAnalytics analytics = FirebaseAnalytics.instance;
  static final FirebaseAnalyticsObserver observer =
  FirebaseAnalyticsObserver(analytics: analytics);
  // ルート画面（main.dart）のMaterialApp()に、 navigatorObservers: [Analytics.observer], と設定することでFirebaseAnalyticsで、ScreenLogが紐づく

  /// イベントを送信する（同時定義のカスタムイベント用）
  /// [event] AnalyticsEvent（必須）
  /// [parameterMap] パラメータMap（オプショナル）
  static Future<void> sendEvent({
        required AnalyticsEvent event,
        Map<String, dynamic>? parameterMap
      }) async {
    final eventName = event.string;
    await analytics.logEvent(name: eventName, parameters: parameterMap);
  }

// MEMO: 下記は、「logEvent」以外のログ送信処理のサンプル
  // /// イベントを送信する(SelectContent利用)
  // static Future<void> sendSelectContent({
  //   required String contentType,
  //   required String itemId,
  // }) async {
  //   await analytics.logSelectContent(
  //       contentType: contentType,
  //       itemId: itemId
  //   );
  // }
  //
  // /// イベントを送信する(ScreenView利用)
  // static Future<void> sendScreenView({
  //   required String screenName,
  // }) async {
  //   await analytics.logScreenView(screenName: screenName);
  //   // print("sendScreenView");
  //   // print(screenName);
  // }

}

その他

FirebaseAnalyticsは、いろいろ制約はあるが、ログ基盤の構築せず、ログ機能ができるのはありがたい。
制限・仕様・管理画面の見え方が、更新される（変更）されるので、都度、最新仕様は公式サイトで確認が必要。

追記（関連する記事）

- BigQueryを使ってみたい方への参考リンク

https://zenn.dev/altiveinc/articles/firebase-analytics-to-bigquery

- BigQueryを初めて触るかへのリンク

また、BigQueryでお金溶かす、可能性もあるので、初めて触る方はご注意を！
注意喚起のため先人の方の轍の軌跡を追記
（※「BigQuery　溶かした」で一旦検索を）

https://qiita.com/itkr/items/745d54c781badc148bb9

Discussion