Facebook認証を組み合わせる話こんにちは、Flutter(Andorid)エンジニアのぬまっちです。(@nuMatch)先月は登壇してきましたブログtech.jxpress.netを投稿しました。Firebaseの相性の良さについて筆を走らせたいと思います。Facebook認証が今回の主役になります。Facebookアカウントを用いたログイン機能を実現させることを目的としています。彼らをまとめて3つのFと呼称したいと思います。アプリを作る上でユーザーを識別したい、という場面は想像に難くありません。それくらいにアカウント管理という機能は私達に密接ですが、いざ組み込もうと思うと考慮しなければいけない事は無数にあります。セキュリティ対策は考えなければなりませんし、ユーザーにとってもログインのし易い作りになっている事も重要です。Authを組み合わせて欲しいです。トークンによるログイン認証に対応したBaaSのことです。Authを組み合わせる事によって、ダッシュボード上での複数プロバイダの管理を行うことが出来るようになります。Authが管理出来るログインプロバイダ覧が見て取れると思います。この画面から各プロバイダの有効/無効の管理をする事も出来ます。Auth上では一人のアカウントとして管理する事が出来るという事なのです。Auth上のアカウント単位でユーザーを管理する事出来ます。今回はフェデレーションIDプロバイダ*1としてFacebookを選択しています。他のプロバイダよりも実名で登録されている事が多いので、そういった理由でプロバイダを選択するのもいいかもしれません。今回、詳細は割愛させて頂きますがFacebook認証をアプリに実装するまでの簡単な流れを説明します。Developer上でアプリIDを申請する下記サイトから申請することが出来ます。Developer上のアプリIDは一つのものとして管理されます。クロスプラットフォームに対応するなら、両OS用に設定が必要になります。それぞれ日本語ドキュメントでしっかり説明しているので、順番に対応しましょう。まで準備すれば問題ないと思います。Developersこちらも全部やる必要はありません。クラス名を記入する必要があります。Flutterアプリ側で確認して間違えの無いように設定しましょう。確認する事が出来ると思います。ダッシュボードでログインプロバイダの中からFacebookを選んで有効にして下さい。入力する項目があるので、それぞれFacebookアプリ側のものを入力しましょう。これでFacebook認証の準備は完了です。側の実装いよいよFlutterアプリ側への実装です。側で認証情報を検証してクライアント(Flutterアプリ)にレスポンスを返却するという流れになります。Auth用とFacebook認証のFlutterプラグインを実装しましょう。^3.0.0(各プラグインのVersionは執筆時点のものです。最新Versionをご確認ください。ユーザーがFacebookに登録してるメールアドレスを要求している。ログイン認証の結果が返却されている上記の内容が実行されると、アプリ上でFacebookに遷移してログイン認証が行われます。Facebook認証の紐付け)が正常に出来ていれば、Facebookにログイン後、Flutterアプリ側に戻ってくると思います。プラグイン*2のReadmeに紹介されている実装方法は古くなっています。Version3.0.0以降で使うのなら上記の書き方にしてください。↓Readmeでは下記の書き方のままになっている。ログインの状態を確認出来ます。側にユーザーアカウントを作成しましょう。Authでのログインが成功して、Firestoreに接続出来ている状態です。ダッシュボードでユーザータブを確認すると、識別子にFacebookのメールアドレスが充てられたユーザーがいると思います。Firestore等の別サービスとの紐付けが行われます。いう3つのFを組み合わせた方法で、アカウントを管理する手順を紹介しました。限られたリソースでiOS、Androidのクロスプラットフォームを実現しつつユーザーアカウントも管理出来るようになる、一つの方法として有効なのではないでしょうか?結婚式のスピーチではよく、「3つの袋」の話が使われますが、今度は代わりに3つのFをネタするのも良いじゃないかな?と思います!*1:ログイン認証に使われるプロバイダ。Facebookの他にはTwitterが多く使われる。2021のゴールドスポンサーとしてスポンサー...2020-09-02IstioとAuth0でJWT認証付きAPIを5分でデプロイするSREのたっち(@TatchNicolas)です。パターン...取締役の小笠原(@yamitzky)です。2019」15日目の記事です。Corp.引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。