【Flutter】iOSアプリにGoogleAnalyticsを導入する手順を紹介

【Flutter】iOSアプリにGoogleAnalyticsを導入する手順を紹介

スポンサーリンク

記事内に広告が含まれています。
吹き出しのイメージ

FlutterにGoogleAnalyticsを導入したいが、方法がわからない。手順を教えて!

ブロガーやエンジニアの方々にはお馴染みのGoogle Analytics(以下、GA4)ですが、Webだけでなくモバイルアプリにも取り入れることができます。

筆者は元々WebでのみGA4を利用していたため、モバイルアプリでも利用できることを知りませんでしたが、モバイルアプリの開発を進める中で、それを知り、実際にFlutterに実装してみました。

今回の記事では、GA4をFlutter製のアプリに導入する手順をご紹介します。

ステップは以下の通りです。

  • GoogleAnalyticsとは?
  • 導入手順

最後までご覧いただき、参考にしていただけると幸いです。

スポンサーリンク

GoogleAnalyticsとは?

Google Analyticsは、Webサイトやアプリの利用状況を追跡・分析するためのツールです。

これを利用することで、ユーザーの行動、流入経路、セッションの長さなど、様々なデータを収集できます。例えば、流入者の性別や年齢、アクセス時の所在地(市区町村までであり、住所まで特定されることはありません)、使用しているデバイスや国などの情報を把握することができます。Webマーケティングなどには必須のツールです。

※知ることのできる情報は他にも色々あります。

スポンサーリンク

導入手順

それでは、実際にFlutter製アプリにGA4を導入して分析を行う方法を紹介します。GoogleのFirebaseというサービスを利用して実装します。

大まかな手順は以下の通りです。

  • Firebaseにログイン
  • プロジェクトを作成
  • Flutterに実装

それぞれ解説します。

Firebaseにログイン

まず、GoogleアカウントでFirebaseにログインし、右上の「Go to Console」をクリックして、Firebaseコンソールページに遷移してください。

プロジェクトを作成

次に、プロジェクトの作成を行います。Firebaseコンソールから「プロジェクトの作成」をクリックし、プロジェクト名を設定します。プロジェクト名は自由に設定可能です。

次に、「Google Analytics」を導入するか聞かれるので、「有効にする」を選択して次に進みます。次にGoogle Analyticsのアカウントを指定します。これはFirebaseではなくGA4を扱う際に必要なアカウントです。まだアカウントを持っていない場合は、新しく作成してください。プロジェクトの作成が完了すると、そのプロジェクトのコンソールに遷移します。

Flutterに実装

まず、先ほど開いたプロジェクトコンソールの「アプリにFirebaseを追加して利用を開始しましょう」の選択肢からiOSを選択してください。ここから実際にFlutterに実装していきます。

アプリの登録

まず、「アプリの登録」では「AppleバンドルID」と「App Store ID」を入力します。「AppleバンドルID」はXcodeのRunner Targetの設定のGeneral内のBundle Identifierから確認できます。「App Store ID」は、App Storeに公開済みであれば入力しましょう。App StoreのアプリのURLの末尾にある、idxxxxxxxxxxxxxxxxの部分が該当します。

設定ファイルのダウンロード

次に、GoogleService-info.plistをダウンロードし、Xcodeでinfo.plistと同じ階層に設置します。

Firebase SDKの追加

Firebase SDKの追加についてはFlutterから実装します。次の手順で進めれば問題ありません。

Flutterの/iosディレクトリ内にあるPodfiletarget 'Runner' doの中に、以下のように記述します。

target 'Runner' do
  # 既存のコードはそのまま
  pod 'Firebase/Analytics'
end

その後、/iosディレクトリでpod installを実行すればOKです。

初期化コードの追加

最後に、初期化コードの追加を行います。AppDelegate.swiftに以下の記述を追加してください。

import FirebaseCore // ここを追加

@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
  
  func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
  ) -> Bool {
    FirebaseApp.configure() // ここを追加
    return true
  }

  // 既存のコードはそのまま
}

これで設定は完了です。このアプリにユーザーが訪れることで、GA4が機能するようになります。

GoogleAnalyticsでログイン

最後に、先ほど作成したGA4のアカウントでGoogle Analyticsにログインし、分析情報を確認できます。または、Firebaseコンソールの「Analytics Dashboard」からもデータを確認することができます。

スポンサーリンク

最後に

ここまで、Flutter製のiOSアプリにGA4を導入する方法について紹介しました。GA4の導入は特別難しいわけではなく、手順に従えば比較的簡単に実装することができます。

また、今回GoogleService-info.plistを追加したことで、GA4だけでなく、さまざまなFirebaseの機能を活用できるようになりました。Firebaseで新たな機能を実装する際には、ぜひ記事にして共有したいと考えています。皆さんもぜひ挑戦してみてください。

最後までお読みいただき、ありがとうございました。

スポンサーリンク

シェアする

フォローする

リアル大学生 - にほんブログ村人気ブログランキング

スポンサーリンク