Flutter アプリに Firebase を追加する

前提条件

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

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

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

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

ステップ 1: 必要なコマンドライン ツールをインストールする

  1. まだインストールしていない場合は、Firebase CLI をインストールします。

  2. Google アカウントで Firebase にログインするには、次のコマンドを実行します。

    firebase login
    
  3. 任意のディレクトリで次のコマンドを実行して、FlutterFire CLI をインストールします。

    dart pub global activate flutterfire_cli
    

ステップ 2: Firebase を使用するようにアプリを構成する

FlutterFire CLI を使用して、Flutter アプリを Firebase に接続するように構成します。

Flutter プロジェクト ディレクトリで、次のコマンドを実行して、アプリの構成ワークフローを開始します。

flutterfire configure


ステップ 3: アプリで Firebase を初期化する

  1. Flutter プロジェクト ディレクトリで、次のコマンドを実行してコア プラグインをインストールします。

    flutter pub add firebase_core
    
  2. Flutter プロジェクト ディレクトリで次のコマンドを実行して、Flutter アプリの Firebase 構成を最新にします。

    flutterfire configure
    
  3. lib/main.dart ファイルで、Firebase Core プラグインと、以前に生成した構成ファイルをインポートします。

    import 'package:firebase_core/firebase_core.dart';
    import 'firebase_options.dart';
    
  4. また、lib/main.dart ファイルで、構成ファイルによってエクスポートされた DefaultFirebaseOptions オブジェクトを使用して Firebase を初期化します。

    await Firebase.initializeApp(
      options: DefaultFirebaseOptions.currentPlatform,
    );
    
  5. Flutter アプリケーションを再ビルドします。

    flutter run
    

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

Flutter アプリでは、Firebase プロダクトごとに 1 つずつ、さまざまな Firebase Flutter プラグインを使用できます(Cloud Firestore、Authentication、Analytics など)。

Flutter はマルチプラットフォーム フレームワークであるため、各 Firebase プラグインは、Apple、Android、ウェブのプラットフォームに適用できます。つまり、Flutter アプリに Firebase プラグインを追加すると、Apple バージョン、Android バージョン、ウェブ バージョンのアプリで使用されます。

Firebase Flutter プラグインを追加する方法は次のとおりです。

  1. Flutter プロジェクト ディレクトリで、次のコマンドを実行します。

    flutter pub add PLUGIN_NAME
  2. Flutter プロジェクト ディレクトリで、次のコマンドを実行します。

    flutterfire configure
    

    このコマンドを実行すると、Flutter アプリの Firebase 構成が最新の状態になり、Android の Crashlytics と Performance Monitoring で必要な Gradle プラグインがアプリに追加されます。

  3. 完了したら、Flutter プロジェクトを再ビルドします。

    flutter run
    

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

使用できるプラグイン

プロダクト プラグイン名 iOS Android ウェブ その他の Apple
(macOS など)
アナリティクス firebase_analytics
ベータ版
App Check firebase_app_check
ベータ版
Authentication firebase_auth
ベータ版
Cloud Firestore cloud_firestore
ベータ版
Cloud Functions cloud_functions
ベータ版
Cloud Messaging firebase_messaging
ベータ版
Cloud Storage firebase_storage
ベータ版
Crashlytics firebase_crashlytics
ベータ版
Dynamic Links firebase_dynamic_links
In-App Messaging firebase_in_app_messaging
Firebase インストール firebase_app_installations
ベータ版
ML モデル ダウンローダー firebase_ml_model_downloader
ベータ版
Performance Monitoring firebase_performance
Realtime Database firebase_database
ベータ版
Remote Config firebase_remote_config
ベータ版

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

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

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

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

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

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

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

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

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

アナリティクスの設定の詳細については、iOS+Androidウェブの各スタートガイドをご覧ください。

次のステップ