LoginSignup
4
3

More than 3 years have passed since last update.

【React】Firebase Authで、アカウントに複数のプロバイダを紐付ける

Last updated at Posted at 2019-12-09

Firebase Authentication、とても便利ですよね。

今回、Firebase Authenticationを使って、Googleログインしたアカウントに対して、電話番号を紐付けます。

Firebaseの準備

Fireabse Authの設定方法はこちら
ログイン方法として、電話番号Google有効にしておいてください。

googleアカウントでの認証

まずはgoogleアカウントで認証させます。
signInWithPopupというメソッドを使います。

電話番号での認証

次に、電話番号での認証です。
reCAPTCHAの設定がちょっとめんどくさいので注意しましょう。
signInWithPhoneNumberというメソッドを使います。

アカウントに複数の認証プロバイダをリンク

ここまで完了したら、
currentUserに対して、linkAndRetrieveDataWithCredentialというメソッドを使い、アカウントに複数の認証プロバイダをリンクさせることができます。

以下のようになっていればOKです。
スクリーンショット 2019-07-13 16.34.45.png

とても簡単に実装することができました。
2要素認証とかも簡単に実現できますね。

今回作成したソースコードをgithutbで公開しています。こちらから
(めっちゃ無駄ですが、アーキテクチャとして、Reduxを採用しています。。。
ちょっと前にリリースされたhooks APIに対応した機能を使ってみたくて...)

参考: 公式ドキュメント

以上です。

4
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
3