Google I/O 2022 で発表された Firebase の最新情報をご覧ください。詳細

FlutterでFirebase認証を開始する

コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。

アプリを Firebase に接続する

Flutter 用の Firebase SDK をまだインストールしていない場合は、インストールして初期化します

アプリに Firebase Authentication を追加する

  1. Flutter プロジェクトのルートから、次のコマンドを実行してプラグインをインストールします。

    flutter pub add firebase_auth
    
  2. 完了したら、Flutter アプリケーションを再構築します。

    flutter run
    
  3. Dart コードにプラグインをインポートします。

    import 'package:firebase_auth/firebase_auth.dart';
    

認証プロバイダを使用するには、 Firebase コンソールで有効にする必要があります。 [Firebase 認証] セクションの [サインイン方法] ページに移動して、メール/パスワードによるサインインと、アプリに必要なその他の ID プロバイダーを有効にします。

(省略可)Firebase Local Emulator Suite でプロトタイプを作成してテストする

アプリがユーザーを認証する方法について説明する前に、認証機能のプロトタイプとテストに使用できる一連のツール、Firebase Local Emulator Suite を紹介しましょう。認証技術とプロバイダーを決定している場合、Authentication と Firebase セキュリティ ルールを使用してパブリック データとプライベート データでさまざまなデータ モデルを試している場合、またはサインイン UI デザインのプロトタイプを作成している場合、ライブ サービスをデプロイせずにローカルで作業できることは素晴らしいアイデアです。 .

認証エミュレーターはローカル エミュレーター スイートの一部であり、アプリがエミュレートされたデータベースのコンテンツと構成、および必要に応じてエミュレートされたプロジェクト リソース (関数、他のデータベース、およびセキュリティ ルール) とやり取りできるようにします。

認証エミュレーターを使用するには、いくつかの手順が必要です。

  1. アプリのテスト構成にコード行を追加して、エミュレーターに接続します。

  2. ローカル プロジェクト ディレクトリのルートから、 firebase emulators:startを実行します。

  3. インタラクティブなプロトタイピングにはローカル エミュレーター スイート UI を使用し、非インタラクティブなテストには認証エミュレーター REST API を使用します。

  4. useAuthEmulator()を呼び出して、エミュレーターのアドレスとポートを指定します。

    Future<void> main() async {
    WidgetsFlutterBinding.ensureInitialized();
    await Firebase.initializeApp();
    
    // Ideal time to initialize
    await FirebaseAuth.instance.useAuthEmulator('localhost', 9099);
    //...
    }
    

詳細なガイドは、アプリを認証エミュレーターに接続するで入手できます。詳細については、 Local Emulator Suiteの概要を参照してください。

それでは、ユーザーを認証する方法を続けましょう。

現在の認証状態を確認する

Firebase Auth は、安全な認証を新規または既存の Flutter アプリケーションに統合できるようにするための多くの方法とユーティリティを提供します。多くの場合、ユーザーがログインしているかログアウトしているかなど、ユーザーの認証状態を知る必要があります。

Firebase Auth を使用すると、 Streamを介してこの状態にリアルタイムでサブスクライブできます。呼び出されると、ストリームはユーザーの現在の認証状態の即時イベントを提供し、認証状態が変化するたびに後続のイベントを提供します。

認証状態の変化をリッスンするには、次の 3 つの方法があります。

authStateChanges()

これらの変更をサブスクライブするには、 FirebaseAuthインスタンスでauthStateChanges()メソッドを呼び出します。

FirebaseAuth.instance
  .authStateChanges()
  .listen((User? user) {
    if (user == null) {
      print('User is currently signed out!');
    } else {
      print('User is signed in!');
    }
  });

イベントは、次の場合に発生します。

  • リスナーが登録された直後。
  • ユーザーがサインインしているとき。
  • 現在のユーザーがサインアウトしたとき。

idTokenChanges()

これらの変更をサブスクライブするには、 FirebaseAuthインスタンスでidTokenChanges()メソッドを呼び出します。

FirebaseAuth.instance
  .idTokenChanges()
  .listen((User? user) {
    if (user == null) {
      print('User is currently signed out!');
    } else {
      print('User is signed in!');
    }
  });

イベントは、次の場合に発生します。

  • リスナーが登録された直後。
  • ユーザーがサインインしているとき。
  • 現在のユーザーがサインアウトしたとき。
  • 現在のユーザーのトークンに変更があった場合。

userChanges()

これらの変更をサブスクライブするには、 FirebaseAuthインスタンスでuserChanges()メソッドを呼び出します。

FirebaseAuth.instance
  .userChanges()
  .listen((User? user) {
    if (user == null) {
      print('User is currently signed out!');
    } else {
      print('User is signed in!');
    }
  });

イベントは、次の場合に発生します。

  • リスナーが登録された直後。
  • ユーザーがサインインしているとき。
  • 現在のユーザーがサインアウトしたとき。
  • 現在のユーザーのトークンに変更があった場合。
  • FirebaseAuth.instance.currentUserによって提供される次のメソッドが呼び出されるとき:
    • reload()
    • unlink()
    • updateEmail()
    • updatePassword()
    • updatePhoneNumber()
    • updateProfile()

認証状態の持続

すべてのプラットフォームの Firebase SDK は、アプリの再起動やページの再読み込み後もユーザーの認証状態が維持されるように、すぐに使用できるサポートを提供します。

Android や iOS などのネイティブ プラットフォームでは、この動作は構成できず、ユーザーの認証状態はアプリの再起動間でデバイスに保持されます。ユーザーは、デバイス設定を使用してアプリのキャッシュ データを消去できます。これにより、保存されている既存の状態が消去されます。

Web プラットフォームでは、ユーザーの認証状態はIndexedDBに保存されます。 Persistence.LOCALを使用して、ローカル ストレージにデータを保存するように永続性を変更できます。必要に応じて、このデフォルトの動作を変更して、現在のセッションの認証状態のみを保持するか、まったく保持しないようにすることができます。これらの設定を構成するには、次のメソッドFirebaseAuth.instanceFor(app: Firebase.app(), persistence: Persistence.LOCAL);を呼び出します。 . setPersistence(Persistence.NONE)を使用して、各 Auth インスタンスの永続性を引き続き更新できます。

// Disable persistence on web platforms. Must be called on initialization:
final auth = FirebaseAuth.instanceFor(app: Firebase.app(), persistence: Persistence.NONE);
// To change it after initialization, use `setPersistence()`:
await auth.setPersistence(Persistence.LOCAL);

次のステップ

サポートされている ID サービスと認証サービスを使用したユーザーのサインインとサインアップに関するガイドをご覧ください。