Firebase Authentication を使用すると、ユーザーがメール アドレスとパスワードを使用して Firebase で認証できるようにし、アプリのパスワード ベースのアカウントを管理できます。
あなたが始める前に
- Firebase を JavaScript プロジェクトに追加します。
- アプリを Firebase プロジェクトにまだ接続していない場合は、 Firebase コンソールから接続します。
- メール/パスワードによるサインインを有効にする:
- Firebase コンソールで、 Authセクションを開きます。
- [サインイン方法] タブで、電子メール/パスワードによるサインイン方法を有効にして、[保存] をクリックします。
パスワードベースのアカウントを作成する
パスワードを使用して新しいユーザー アカウントを作成するには、アプリのサインアップ ページで次の手順を実行します。
- 新しいユーザーがアプリのサインアップ フォームを使用してサインアップするときは、新しいアカウントのパスワードが正しく入力され、複雑さの要件を満たしていることを確認するなど、アプリで必要な新しいアカウントの検証手順を完了します。
- 新しいユーザーの電子メール アドレスとパスワードを
createUserWithEmailAndPassword
に渡して、新しいアカウントを作成します。新しいアカウントが作成された場合、ユーザーは自動的にサインインします。以下の「次のステップ」セクションを参照して、サインインしているユーザーの詳細を取得してください。Web version 9
import { getAuth, createUserWithEmailAndPassword } from "firebase/auth"; const auth = getAuth(); createUserWithEmailAndPassword(auth, email, password) .then((userCredential) => { // Signed in const user = userCredential.user; // ... }) .catch((error) => { const errorCode = error.code; const errorMessage = error.message; // .. });
Web version 8
firebase.auth().createUserWithEmailAndPassword(email, password) .then((userCredential) => { // Signed in var user = userCredential.user; // ... }) .catch((error) => { var errorCode = error.code; var errorMessage = error.message; // .. });
これは、エラーをキャッチして処理できる場所でもあります。エラー コードのリストについては、 Auth Reference Docsを参照してください。
メールアドレスとパスワードを使用してユーザーにサインインする
パスワードを使用してユーザーをサインインする手順は、新しいアカウントを作成する手順と似ています。アプリのサインイン ページで、次の操作を行います。
- ユーザーがアプリにサインインするときに、ユーザーのメール アドレスとパスワードを
signInWithEmailAndPassword
に渡します。以下の「次のステップ」セクションを参照して、サインインしているユーザーの詳細を取得してください。Web version 9
import { getAuth, signInWithEmailAndPassword } from "firebase/auth"; const auth = getAuth(); signInWithEmailAndPassword(auth, email, password) .then((userCredential) => { // Signed in const user = userCredential.user; // ... }) .catch((error) => { const errorCode = error.code; const errorMessage = error.message; });
Web version 8
firebase.auth().signInWithEmailAndPassword(email, password) .then((userCredential) => { // Signed in var user = userCredential.user; // ... }) .catch((error) => { var errorCode = error.code; var errorMessage = error.message; });
これは、エラーをキャッチして処理できる場所でもあります。エラー コードのリストについては、 Auth Reference Docsを参照してください。
推奨: メール列挙保護を有効にする
メール アドレスをパラメータとして受け取る一部の Firebase Authentication メソッドでは、登録が必要なときにメール アドレスが登録されていない場合 (たとえば、メール アドレスとパスワードを使用してサインインする場合)、または未使用である必要があるときに登録された場合 (たとえば、ユーザーのメールアドレスを変更する場合)。これは、ユーザーに特定の救済策を提案するのに役立ちますが、悪意のあるアクターが悪用して、ユーザーが登録した電子メール アドレスを発見することもできます。
このリスクを軽減するには、Google Cloud のgcloud
ツールを使用して、プロジェクトのメール列挙保護を有効にすることをお勧めします。この機能を有効にすると、Firebase Authentication のエラー報告の動作が変わることに注意してください。アプリがより具体的なエラーに依存していないことを確認してください。
次のステップ
ユーザーが初めてサインインすると、新しいユーザー アカウントが作成され、サインインに使用したユーザーの資格情報 (ユーザー名とパスワード、電話番号、または認証プロバイダー情報) にリンクされます。この新しいアカウントは Firebase プロジェクトの一部として保存され、ユーザーのサインイン方法に関係なく、プロジェクト内のすべてのアプリでユーザーを識別するために使用できます。
アプリでユーザーの認証ステータスを知るための推奨される方法は、
Auth
オブジェクトにオブザーバーを設定することです。その後、User
オブジェクトからユーザーの基本的なプロファイル情報を取得できます。ユーザーの管理を参照してください。Firebase Realtime Database と Cloud Storageセキュリティ ルールでは、サインインしているユーザーの一意のユーザー ID を
auth
変数から取得し、それを使用してユーザーがアクセスできるデータを制御できます。
認証プロバイダーの資格情報を既存のユーザー アカウントにリンクすることで、ユーザーが複数の認証プロバイダーを使用してアプリにサインインできるようにすることができます。
ユーザーをサインアウトするには、 signOut
を呼び出します。
Web version 9
import { getAuth, signOut } from "firebase/auth"; const auth = getAuth(); signOut(auth).then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });
Web version 8
firebase.auth().signOut().then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });