Google は、黒人コミュニティのための人種的公平の促進に取り組んでいます。詳細をご覧ください。

Flutter アプリに Firebase を追加する

このガイドの手順に沿って、Flutter アプリに Firebase プロダクトを追加してください。

事前準備

  • お好みのエディタまたは IDE をインストールします。

  • Flutter アプリのターゲットが iOS 8 以降であることを確認します。

  • アプリを実行する物理 iOS デバイスまたは iOS シミュレータを設定します。

    • Cloud Messaging の場合は、次の作業を行います。

      • 物理 iOS デバイスを設定します。
      • Apple Developer アカウントの Apple Push Notification Authentication Key を取得します。
      • プッシュ通知を XCode の [App] > [Capabilities] で有効にします。
    • その他のすべての Firebase プロダクトで、物理 iOS デバイスと iOS シミュレータのいずれかを使用できます。

  • 以下のコンポーネントを含む、ご利用のオペレーティング システムに対応した Flutter をインストールします。

    • Flutter SDK
    • サポート ライブラリ
    • プラットフォーム固有のソフトウェアと SDK
  • Google アカウントを使用して Firebase にログインします。

Flutter アプリがまだない場合は、スタートガイド: テストドライブを参照して、お好みのエディタまたは IDE で新しい Flutter アプリを作成してください。

ステップ 1: Firebase プロジェクトを作成する

Flutter アプリに Firebase を追加する前に、アプリに接続するための Firebase プロジェクトを作成します。Firebase プロジェクトの詳細については、Firebase プロジェクトについて理解するをご覧ください。

ステップ 2: アプリを Firebase に登録する

  1. Firebase コンソールの [プロジェクトの概要] ページの中央にある iOS アイコン()をクリックして設定ワークフローを起動します。

    すでに Firebase プロジェクトにアプリを追加している場合は、[アプリを追加] をクリックするとプラットフォームのオプションが表示されます。

  2. アプリのバンドル ID を [iOS バンドル ID] に入力します。

    XCode 内で開いたプロジェクトからバンドル ID を見つけます。プロジェクト ナビゲータで最上位のアプリを選択し、[全般] タブにアクセスします。[バンドル ID] の値が iOS バンドル ID です(例: com.yourcompany.ios-app-name)。

  3. (省略可)設定ワークフローの指示に従って他のアプリ情報を入力します。

  4. [アプリを登録] をクリックします。

ステップ 3: Firebase 構成ファイルを追加する

  1. [GoogleService-Info.plist をダウンロード] をクリックして、Firebase iOS 構成ファイル(GoogleService-Info.plist)を取得します。

    • Firebase iOS 構成ファイルはいつでも再ダウンロードできます。
    • 構成ファイルに (2) のような文字が追加されていないことを確認してください。
  2. XCode を使用して、Flutter アプリの Runner/Runner ディレクトリに移動します。

  3. Firebase コンソールの設定ワークフローに戻り、[次へ] をクリックして残りの手順をスキップします。

  4. FlutterFire プラグインを追加するに進みます。

ステップ 4: FlutterFire プラグインを追加する

Flutter はプラグインを使用して、Firebase API などの幅広いプラットフォーム固有サービスへのアクセスを提供します。プラグインには、各プラットフォームのサービスと API にアクセスするためのプラットフォーム固有のコードが含まれています。

Firebase へのアクセスには、Firebase プロダクト(Realtime Database、Authentication、アナリティクス、Cloud Storage など)ごとに存在するさまざまなライブラリが使用されます。Flutter が提供する Firebase プラグインのセットは、FlutterFire と総称されています。

Flutter はマルチプラットフォームの SDK であるため、各 FlutterFire プラグインは iOS と Android の両方に適用できます。つまり、Flutter アプリに追加した FlutterFire プラグインは、iOS と Android の両方のバージョンの Firebase アプリで使用されます。

FlutterFire プラグインの最新リストについては、FlutterFire のドキュメントをご覧ください。

  1. エミュレータまたはデバイス上で、アプリが実行されていないことを確認します。

  2. Flutter アプリのルート ディレクトリから、pubspec.yaml ファイルを開きます。

  3. Firebase Core Flutter SDK 用の FlutterFire プラグインを追加します。

    dependencies:
      flutter:
        sdk: flutter
      # Add the dependency for the Firebase Core Flutter SDK
      firebase_core: ^0.4.0+9
    
  4. アプリで使用する Firebase プロダクトの FlutterFire プラグインを追加します。

    アナリティクスが有効な場合

    dependencies:
      flutter:
        sdk: flutter
      # Check that you have this dependency (added in the previous step)
      firebase_core: ^0.4.0+9
    # Add the dependency for the FlutterFire plugin for Google Analytics firebase_analytics: ^5.0.2
    # Add the dependencies for any other Firebase products you want to use in your app # For example, to use Firebase Authentication and Cloud Firestore firebase_auth: ^0.14.0+5 cloud_firestore: ^0.12.9+5

    アナリティクスが無効な場合

    dependencies:
      flutter:
        sdk: flutter
      # Check that you have this dependency (added in the previous step)
      firebase_core: ^0.4.0+9
    # Add the dependencies for the Firebase products you want to use in your app # For example, to use Firebase Authentication and Cloud Firestore firebase_auth: ^0.14.0+5 cloud_firestore: ^0.12.9+5
  5. flutter packages get を実行します。
    パッケージとプラグインの管理の詳細については、パッケージの使用をご覧ください。

  6. アナリティクスを追加した場合は、アプリを実行して、Firebase の統合に成功したという確認を Firebase に送信します。それ以外の場合は、この確認手順をスキップできます。

これで設定は完了です。Flutter アプリは Firebase を使用するように登録され、構成されました。

アナリティクスを使ってサンプルアプリを試す

すべてのパッケージと同様に、firebase_analytics プラグインにはサンプル プログラムが含まれています。

  1. Firebase を使用するように構成した Flutter アプリを開きます(このページの手順を参照)。

  2. アプリの lib ディレクトリにアクセスして、既存の main.dart ファイルを削除します。

  3. Google アナリティクスのサンプル プログラム リポジトリから、次の 2 つのファイルをコピーしてアプリの lib ディレクトリに貼り付けます。

    • main.dart
    • tabs_page.dart
  4. Flutter アプリを実行します。

  5. Firebase コンソールでアプリの Firebase プロジェクトに移動し、左側のナビゲーションで [分析] をクリックします。

    • [Dashboard] をクリックします。アナリティクスが正常に動作している場合、ダッシュボードの [過去 30 分間のユーザー] パネルにアクティブなユーザーが表示されます(この処理にはしばらく時間がかかる場合があります)。

    • [DebugView] をクリックします。この機能を有効にすると、サンプル プログラムによって生成されたすべてのイベントが表示されます。

アナリティクスの設定の詳細については、iOSAndroid のスタートガイドをご覧ください。

次のステップ