web-dev-qa-db-ja.com

onAuthStateChangedを使用したFlutterを使用したFirebaseログイン

Flutterの外部では、firebase認証を実装するときに、常にfirebaseが提供するonAuthStateChangedリスナーを使用して、ユーザーがログインしているかどうかを判断し、それに応じて応答します。

Flutterを使用して同様のことをしようとしていますが、FirebaseのonAuthStateChangedにアクセスする方法を見つけることができます。 firebase_authおよびgoogle_signin Flutterプラグインを使用しています。 firebase_auth Flutterプラグインに含まれているサンプルコードを使用しています。以下はサンプルコードです。 Googleサインインで正常にログインできますが、ユーザーのサインイン/サインアウト状態を検出するオブザーバー/リスナーが必要なので、例は単純すぎます。

Firebase_auth/google_signin flutterプラグインを使用してユーザーのステータスを判断するオブザーバー/リスナーを介して検出する方法はありますか？

最終的には、ユーザーがログインしているかどうか（yes/no）をアプリに判断させます。ログイン画面を表示しない場合は、ログイン画面を表示し、表示する場合はメインアプリページを表示します。

import 'Dart:async';
import 'Dart:io';

import 'package:flutter/material.Dart';
import 'package:firebase_auth/firebase_auth.Dart';
import 'package:google_sign_in/google_sign_in.Dart';

final FirebaseAuth _auth = FirebaseAuth.instance;
final GoogleSignIn _googleSignIn = new GoogleSignIn();

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Firebase Auth Demo',
      home: new MyHomePage(title: 'Firebase Auth Demo'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  Future<String> _message = new Future<String>.value('');

  Future<String> _testSignInAnonymously() async {
    final FirebaseUser user = await _auth.signInAnonymously();
    assert(user != null);
    assert(user == _auth.currentUser);
    assert(user.isAnonymous);
    assert(!user.isEmailVerified);
    assert(await user.getToken() != null);
    if (Platform.isIOS) {
      // Anonymous auth doesn't show up as a provider on iOS
      assert(user.providerData.isEmpty);
    } else if (Platform.isAndroid) {
      // Anonymous auth does show up as a provider on Android
      assert(user.providerData.length == 1);
      assert(user.providerData[0].providerId == 'firebase');
      assert(user.providerData[0].uid != null);
      assert(user.providerData[0].displayName == null);
      assert(user.providerData[0].photoUrl == null);
      assert(user.providerData[0].email == null);
    }
    return 'signInAnonymously succeeded: $user';
  }

  Future<String> _testSignInWithGoogle() async {
    final GoogleSignInAccount googleUser = await _googleSignIn.signIn();
    final GoogleSignInAuthentication googleAuth =
        await googleUser.authentication;
    final FirebaseUser user = await _auth.signInWithGoogle(
      accessToken: googleAuth.accessToken,
      idToken: googleAuth.idToken,
    );
    assert(user.email != null);
    assert(user.displayName != null);
    assert(!user.isAnonymous);
    assert(await user.getToken() != null);
    return 'signInWithGoogle succeeded: $user';
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: new Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          new MaterialButton(
              child: const Text('Test signInAnonymously'),
              onPressed: () {
                setState(() {
                  _message = _testSignInAnonymously();
                });
              }),
          new MaterialButton(
              child: const Text('Test signInWithGoogle'),
              onPressed: () {
                setState(() {
                  _message = _testSignInWithGoogle();
                });
              }),
          new FutureBuilder<String>(
              future: _message,
              builder: (_, AsyncSnapshot<String> snapshot) {
                return new Text(snapshot.data ?? '',
                    style: const TextStyle(
                        color: const Color.fromARGB(255, 0, 155, 0)));
              }),
        ],
      ),
    );
  }
}

問題のflutterパッケージへのリンクは次のとおりです。 https://github.com/flutter/plugins/tree/master/packages/firebase_authhttps://github.com/flutter/ plugins/tree/master/packages/google_sign_in

firebasedartfirebase-authenticationgoogle-signinflutter
11
Gilberg

Firebase for Flutter Codelab には、GoogleサインインとFirebase authを使用したより詳細な例があります。

最終ステップ の後、この_ensureLoggedInユーザーがサインインしているかどうかを確認し、サインインしていない場合はサインインフローを開始するために使用される関数。

Future<Null> _ensureLoggedIn() async {
  GoogleSignInAccount user = googleSignIn.currentUser;
  if (user == null)
    user = await googleSignIn.signInSilently();
  if (user == null) {
    user = await googleSignIn.signIn();
    analytics.logLogin();
  }
  if (auth.currentUser == null) {
    GoogleSignInAuthentication credentials =
    await googleSignIn.currentUser.authentication;
    await auth.signInWithGoogle(
      idToken: credentials.idToken,
      accessToken: credentials.accessToken,
    );
  }
}

これを変更して、アプリの起動時にこれらのことを確認し、事前認証ユーザーと事後認証ユーザーに次のような条件で異なるビューを条件付きで表示できます。

final auth = FirebaseAuth.instance;

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
        title: 'MyApp',
        home: (_checkLogin() == true ? new PostAuthScaffold() : new PreAuthScaffold())
    );
  }
}

bool _checkLogin() {
  GoogleSignInAccount user = googleSignIn.currentUser;
  return !(user == null && auth.currentUser == null);
}
3
FrederickCook

私は、共有設定を使用して認証状態の変更情報を取得するのと同じクエリを使用しました。また、FirebaseとflutterでShared Prefrencesを使用してプロジェクトを構築しました。私が書いたブログを読むことができることを知りたい場合：

Flutterの共有プリフレンスを使用したFirebaseAuthStateListenerの実装。」 https://medium.com/@vaibhavminiyar/implementing-firebaseauthstatelistener-using-shared-prefrences-in-flutter-b42e12f81eb2

1
Vaibhav Miniyar