[Flutter] Firebase Authentication の導入 (Debug用)

Firebase Authentication を使ってGoogleアカウントによる認証を Flutter で導入してみる。Android/iOS ともにFirebase Authenticationを使ったことがなかったのでいくつかハマった、のでメモ。

今回は Debug 用の話なので、もしかしたら Release の際には他にも設定などが必要かもしれない。あくまでも、とりあえず勉強がてら遊んでみたい、という目的なことに注意。

基本的には、以下の公式な導入方法に従えばよいはず。

Firebase Console にて Authentication を有効にする

Firebase Console から Authentication 機能を有効にする。

「Authentication」 -> 「ログイン方法」 -> 「Google」 とたどり、有効/無効を切り替えるスイッチをONにする。

今回はとりあえず Google アカウントでのログインのみを試す。他にも Facebook とか Twitter とかある。便利だなぁ。。。

パッケージの導入

２つのパッケージが必要になる。　以下の様に google_sign_in と firebase_auth の２つを追加。その後 Packages Get を実行。

dependencies:
  flutter:
    sdk: flutter
  google_sign_in:
  firebase_auth:

iOS と Android で必要な作業が異なる。

iOS:

iOS で利用するためには以下が必要。

設定ファイルの設置と Info.plist の編集

GoogleServices-Info.plist を Firebase Console からダウンロードして、 ios/Runner/GoogleServices-Info.plist に配置する。

ios/Runner/Info.plist に以下を追記。 GoogleServices-Info.plist の REVERSED_CLIENT_ID の値をコピペすること！

<!-- Google Sign-in Section -->
<key>CFBundleURLTypes</key>
<array>
	<dict>
		<key>CFBundleTypeRole</key>
		<string>Editor</string>
		<key>CFBundleURLSchemes</key>
		<array>
			<string>{GoogleServices-Info.plist から REVERSED_CLIENT_IDをコピーしてここに貼り付ける}</string>
		</array>
	</dict>
</array>
<!-- End of the Google Sign-in Section -->

Android:

Android で利用するためには以下を行う必要がある。

証明書のSHA1をFirebaseに登録

Android で利用するためには Firebase Console の Android アプリ設定から、証明書の Fingerprint (SHA-1) を設定する必要がある。

Debug 用の証明書の Fingerprint　は以下のコマンドで確認できる。(おそらく一回はビルドしていることが必要。ビルド時に自動生成されるようだ？)

$ keytool -list -v -keystore ~/.android/debug.keystore

上記コマンドを実行すると、「証明書のフィンガプリント」という項目があるので、そこの SHA1 をコピーし、

「Firebase Console」 -> 「プロジェクト設定」 -> 「Androidアプリ」　-> 「フィンガープリントの追加」

にペーストして追加。

gradle ファイルの編集

android/build.gradle の dependencies に classpath 'com.google.gms:google-services:3.2.1' を追加。

android/app/build.gradle の末尾に apply plugin: 'com.google.gms.google-services' を追記。

もしかしたら Firebase の他の機能などを利用する過程で、すでに記入されているかもしれない。その場合は何もしなくて良い。

使ってみる

まずは import をする。

import 'package:firebase_auth/firebase_auth.dart';
import 'package:google_sign_in/google_sign_in.dart';

GoogleSignIn と FirebaseAuth を初期化する。

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

以下のような感じで認証が実行できる。画面遷移などは勝手に行われる。

// この関数を呼び出せば、画面遷移なども含めて認証が行われる。成功すれば user が取得できる。
Future<FirebaseUser> _handleSignIn() async {
  GoogleSignInAccount googleUser = await _googleSignIn.signIn();
  GoogleSignInAuthentication googleAuth = await googleUser.authentication;
  FirebaseUser user = await _auth.signInWithGoogle(
    accessToken: googleAuth.accessToken,
    idToken: googleAuth.idToken,
  );
  print("signed in " + user.displayName);
  return user;
}

おわり

Androidアプリを作ったことがなかったので、証明書関連で少し躓いた。iOS版では GoogleServices-Info.plist の REVERSED_CLIENT_ID の値を使わないと行けないところを、公式ページに書いてある内容をそのままコピペしてしまってクラッシュしてしまたりして躓いた。。。

要注意。