Firebase の Cloud Firestone を利用する際に、認証処理が必要になったので実装方法をまとめ。
…認証系の処理はどうも苦手なんです…！
公式サイトのドキュメントはこちらから。
Authentication | React Native Firebase
https://rnfirebase.io/auth/usage
さて、まずは下記コマンドでライブラリをインストールします。
npm install @react-native-firebase/auth --save // iOS の環境の場合は下記も実行する npx pod-install
なお、@react-native-firebase/app のインストールと設定については割愛します。
もしやり方を知りたい場合は、公式ドキュメントをご参照ください。
事前準備はこれで OK なので、あとは任意のログイン・新規会員登録の処理を行ってください。
私はメールアドレスとパスワードでのログインと新規会員登録の処理を実装しました。
サンプルコードは以下のとおりです。
/* ログイン */
auth()
.signInWithEmailAndPassword(mailaddress, password)
.then(() => {
// ログイン成功時の処理を記述
console.log('Login Success!');
})
.catch(error => {
// ログイン失敗時の処理を記述
console.log(error);
});
/* 新規会員登録 */
auth()
.createUserWithEmailAndPassword(mailaddress, password)
.then(() => {
// 登録成功時の処理を記述
console.log('Sign up Success!');
})
.catch(error => {
// 登録失敗時の処理を記述
console.log(error);
});
なお、エラー発生時に返却されるエラー情報には、エラーコードが含まれています。
error.code で取得でき、中身は auth/invalid-email や auth/user-not-found などといった文字列です。
今回は省略してしまっていますが、エラー内容ごとに処理を分けたい場合は、このエラーコードで判断すると良いです。
また、既にログイン済みの状態で、ログインユーザの情報を確認したい場合は下記のように記述します。
/* ログイン済みユーザの情報取得 */ const user = auth().currentUser; console.log(user);
登録メールアドレスや、設定してあれば名前等が返却されています。
なお、もしログインしていない状態で上記を実行した場合は null が返却されます。
そのため、ログイン済みかどうかの判断をする際にも使えます。
最後にログアウト処理がこちら。
/* ログアウト */
if (auth().currentUser !== null) {
auth().signOut();
}
ワーニングが発生したため、ログイン済みかどうかの判定を追加しています。
私が実装した機能は以上です。
ドキュメントを見ると、ログイン・新規会員登録は、Facebook、Twitter などの SNS アカウントを用いたもののほかにも、Apple アカウントや 電話番号を利用したものもありました。
何を使うのかについては、アプリに合わせて判断してください。
以上、React Native で Firebase の Authentication を実装する方法についてでした。
ご参考になれば幸いです。
