あんまりにもFirebaseのログイン処理を書きたくなかったので、Firebase Auth UIを呼び出せないかと試行錯誤してみました。
github.com
（プラグイン名とかで何か都合が悪くなったら取り下げたいなと思うけれど、）pub.devにも公開中です。
とりあえず別の開発中のアプリで取り込んでみて、動作見ながら安定させるまではbetaなイメージ。
pub.dev
Firebase UI
Firebaseにはいくつか便利な機能がありますが、ユーザーを"Firebase User"として扱うためFirebase Authenticationを利用することは多いですよね。
ログインユーザーの管理、Google sing inやFacabook Loginのサポートなどなど至れり尽くせり。
firebase.google.com
ただ、どうしてもメールアドレスのバリデーションやなんらかの自動提案など、よいログイン機能を提供するのは骨が折れます。
パスワードの自動生成がiOSでできるからとAndroidでやろうとしたら、うまくいかないなんてこともあったり。Sign in with Appleの見せ方がわからなかったり。
そんな時に便利なのがFirebase UIです。
firebase.google.com
firebase.google.com
Webもあるよ。
firebase.google.com
ざっくり言うと、Sign up/Sign in画面が用意されているので、使ってねっていうライブラリです。
各プラットフォームそこそこ細かいカスタマイズができて、Terms of Serviceのリンクや一部画面のみのカスタマイズなんかもできます。
FlutterとFirebase UI
Flutter向けのFirebase Pluginは非常に強くサポートされているのですが、Firebase Auth UIはまだ提案段階です。
github.com
github.com
このため、Dartで書かれた下記のライブラリがよく利用されていました。
※いたようです、ユーザー数が多い
pub.dev
pub.dev
ただ悲しいことにTwitter SDKが死んでしまった関係などで、ライブラリの利用が難しい状況になっています。
そんなわけで、AndroidとiOSのネイティブSDKを利用してpluginを書いてみようかなと思った次第です。
使い方
まだまだ自分の中でもしっくりきていないのですが、大体下記のようにするとFirebase UIが呼び出せるようにしてあります。
class _MyAppState extends State<MyApp> {
@override
void initState() {
super.initState();
initProviders();
}
Future<void> initProviders() async {
FlutterAuthUi.setEmail();
FlutterAuthUi.setApple();
FlutterAuthUi.setGithub();
FlutterAuthUi.setGoogle();
FlutterAuthUi.setMicrosoft();
FlutterAuthUi.setYahoo();
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('Plugin example app'),
),
body: Center(
child: Column(
children: [
RaisedButton(
child: const Text("start ui"),
onPressed: () async {
final user = await FlutterAuthUi.startUi();
print(user);
}),
],
),
),
),
);
}
}
使うとこんな感じ。
Firebase Auth UIには Logout メソッドもあるのですが、今のところ「ログイン処理をFlutter Auth UIを呼び出して利用する」ことを主眼にしているので追加していません。
同様にAndroidとiOSのそれぞれにある細やかなカスタマイズ機能も未実装です。
とりあえずFirebase Auth UIを呼び出してユーザーにログインしてもらう、成功したら user が返ってくる/失敗したらnullが返ってくるという感じです。
作ってみての感想
- Webのサポートどうすればいいのか全然わからない、jsのライブラリをscriptとして読み込んで利用すればいいのだろう
- iOSのcocoapod追加が鬼門、staticで読み込んじゃったので何か問題があったらなんとかしたい
- AndroidのminSDKVersionに迷う、Flutterが16サポートしているけれど少なくとも21にしたかったのでしてみた。いいのだろうか？
- 1月2日から大体2週間ぐらいでできたので年始のFlutterはじめっぽくてよかった
自分のアプリに利用するベースでいじっていきます。
よろしくお願いします。
基礎から学んだ方がいいかなーと最近思案中。
Twitter見返したら10月ごろに一度チャレンジして挫折してたのを思い出した。
ちょっと成長した感じがあってよかった。
