You can use Firebase Authentication to let your users authenticate with Firebase using their email addresses and passwords, and to manage your app's password-based accounts.
Before you begin
- Add Firebase to your JavaScript project.
- If you haven't yet connected your app to your Firebase project, do so from the Firebase console.
- Enable Email/Password sign-in:
- In the Firebase console, open the Auth section.
- On the Sign in method tab, enable the Email/password sign-in method and click Save.
Create a password-based account
To create a new user account with a password, complete the following steps in your app's sign-up page:
- When a new user signs up using your app's sign-up form, complete any new account validation steps that your app requires, such as verifying that the new account's password was correctly typed and meets your complexity requirements.
- Create a new account by passing the new user's email address and password
to
createUserWithEmailAndPassword
:Web
import { getAuth, createUserWithEmailAndPassword } from "firebase/auth"; const auth = getAuth(); createUserWithEmailAndPassword(auth, email, password) .then((userCredential) => { // Signed up const user = userCredential.user; // ... }) .catch((error) => { const errorCode = error.code; const errorMessage = error.message; // .. });
Web
firebase.auth().createUserWithEmailAndPassword(email, password) .then((userCredential) => { // Signed in var user = userCredential.user; // ... }) .catch((error) => { var errorCode = error.code; var errorMessage = error.message; // .. });
This is also where you can catch and handle errors. For a list of error codes have a look at the Auth Reference Docs.
Sign in a user with an email address and password
The steps for signing in a user with a password are similar to the steps for creating a new account. In your app's sign-in page, do the following:
- When a user signs in to your app, pass the user's email address and
password to
signInWithEmailAndPassword
:Web
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
firebase.auth().signInWithEmailAndPassword(email, password) .then((userCredential) => { // Signed in var user = userCredential.user; // ... }) .catch((error) => { var errorCode = error.code; var errorMessage = error.message; });
This is also where you can catch and handle errors. For a list of error codes have a look at the Auth Reference Docs.
Recommended: Set a password policy
You can improve account security by enforcing password complexity requirements.
To configure a password policy for your project, open the Password policy tab on the Authentication Settings page of the Firebase console:
Firebase Authentication password policies support the following password requirements:
Lowercase character required
Uppercase character required
Numeric character required
Non-alphanumeric character required
The following characters satisfy the non-alphanumeric character requirement:
^ $ * . [ ] { } ( ) ? " ! @ # % & / \ , > < ' : ; | _ ~
Minimum password length (ranges from 6 to 30 characters; defaults to 6)
Maximum password length (maximum length of 4096 characters)
You can enable password policy enforcement in two modes:
Require: Attempts to sign in fail until the user updates to a password that complies with your policy.
Notify: Users are allowed to sign in with a non-compliant password. When using this mode, you should check if the user's password complies with the policy on the client side and prompt the user in some way to update their password if it does not comply.
New users are always required to choose a password that complies with your policy.
If you have active users, we recommend not enabling require mode unless you intend to block access to users whose passwords don't comply with your policy. Instead, use notify mode, which allows users to sign in with their current passwords, and inform them of the requirements their password lacks.
Validating a password on the client
import { getAuth, validatePassword } from "firebase/auth";
const status = await validatePassword(getAuth(), passwordFromUser);
if (!status.isValid) {
// Password could not be validated. Use the status to show what
// requirements are met and which are missing.
// If a criterion is undefined, it is not required by policy. If the
// criterion is defined but false, it is required but not fulfilled by
// the given password. For example:
const needsLowerCase = status.containsLowercaseLetter !== true;
}
Recommended: Enable email enumeration protection
Some Firebase Authentication methods that take email addresses as parameters throw specific errors if the email address is unregistered when it must be registered (for example, when signing in with an email address and password), or registered when it must be unused (for example, when changing a user's email address). While this can be helpful for suggesting specific remedies to users, it can also be abused by malicious actors to discover the email addresses registered by your users.
To mitigate this risk, we recommend you enable email enumeration protection
for your project using the Google Cloud gcloud
tool. Note that enabling this
feature changes Firebase Authentication's error reporting behavior: be sure your app
doesn't rely on the more specific errors.
Next steps
After a user signs in for the first time, a new user account is created and linked to the credentials—that is, the user name and password, phone number, or auth provider information—the user signed in with. This new account is stored as part of your Firebase project, and can be used to identify a user across every app in your project, regardless of how the user signs in.
-
In your apps, the recommended way to know the auth status of your user is to set an observer on the
Auth
object. You can then get the user's basic profile information from theUser
object. See Manage Users. In your Firebase Realtime Database and Cloud Storage Security Rules, you can get the signed-in user's unique user ID from the
auth
variable, and use it to control what data a user can access.
You can allow users to sign in to your app using multiple authentication providers by linking auth provider credentials to an existing user account.
To sign out a user, call
signOut
:
Web
import { getAuth, signOut } from "firebase/auth"; const auth = getAuth(); signOut(auth).then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });
Web
firebase.auth().signOut().then(() => { // Sign-out successful. }).catch((error) => { // An error happened. });