hamburger

主に日記

FlutterでFirebaseAuthを使ってみた

firebase.google.com

pub.dev

目的

  • 仕事で認証系の処理に関わることがあり、なんとなく興味がわいた。SDKの使い勝手や認証プロセスをどこまで抽象化しているのか気になった。
  • 自分で何かサービスを作ろうとしたときに、もはや認証は避けて通れない気がした。明示的なログインがなくともユーザの区別はつけたくなりそう。また、Firebaseの他機能を利用しようとするとAuthは必須なのでいい機会だと思った

やったこと

公式サイトを見ながら、匿名ログインとgoogleログインだけ試した(Androidのみ)。実際のログイン処理はSDK内でやってくれるので、開発者はライブラリの呼び出しと設定をするだけ。あっという間にできた

初期化処理

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(const MyApp());
}

WidgetsFlutterBinding.ensureInitialized();についてはこちら [Flutter] WidgetsBindingとは何か? - Qiita

状態監視

ログイン後に何かしたい時などはstateのlistenで制御する。今回は画面表示を切り替えるためにフラグを更新した

class _MyHomePageState extends State<MyHomePage> {
  bool _isLoading = false;
  bool _isLogin = false;
  FirebaseAuth _auth = FirebaseAuth.instance;

  @override
  void initState() {
    super.initState();
    _auth.authStateChanges().listen((User? user) {
      setState(() {
        _isLogin = user != null;
      });
    });
  }
}

ログイン処理

先に許可するプロセスをFirebaseのコンソール側でONにしておく

f:id:burgerham:20211210104842p:plain

対応する処理をボタン押下時に呼び出す

                  ElevatedButton(
                    child: Text("匿名ログイン"),
                    onPressed: () async {
                      try {
                        setState(() {
                          _isLoading = true;
                        });
                        final userCredential = await _auth.signInAnonymously();
                      } on FirebaseAuthException catch (e) {
                        print(e);
                      } finally {
                        setState(() {
                          _isLoading = false;
                        });
                      }
                    },

                  ),
                  ElevatedButton(
                    child: Text("googleログイン"),
                    onPressed: () async {
                      try {
                        setState(() {
                          _isLoading = true;
                        });
                        final GoogleSignInAccount? googleUser =
                            await GoogleSignIn().signIn();

                        final GoogleSignInAuthentication? googleAuth =
                            await googleUser?.authentication;

                        final credential = GoogleAuthProvider.credential(
                          accessToken: googleAuth?.accessToken,
                          idToken: googleAuth?.idToken,
                        );

                        final userCredential = await FirebaseAuth.instance
                            .signInWithCredential(credential);
                      } on FirebaseAuthException catch (e) {
                        print(e);
                      } finally {
                        setState(() {
                          _isLoading = false;
                        });
                      }
                    },
                  ),

これだけ

所感

  • 非常に簡単。匿名ログインは書くコード量が少ないので、ログイン画面が無いサービスはとりあえずアプリ起動時に匿名ログイン実行して識別できるようにしておけば良さそう
  • Googleログインは実際のUIはSDK側が作ってくれるので、最初に考えていた以上にすぐできた。たしかにこれなら他SNSログインもサクサク作れそう。
  • FirebaseAuthのラインナップに入っていないサービスで外部ID連携をしたくなったとき今後は億劫になりそう。国内サービスとか。簡単に連携できると実装する開発者も増えるし、逆に自社サービス内だけで連携させてる限りSNSログインでメジャーにならない。そうすると長期的に見てユーザ数が頭打ちになりそうなので、toC系は辛いところ。

github.com