You can use Firebase Authentication to allow users to sign in to your app using one or more sign-in methods, including email address and password sign-in, and federated identity providers such as Google Sign-in and Facebook Login. This tutorial gets you started with Firebase Authentication by showing you how to add email address and password sign-in to your app.
Connect your app to Firebase
Install the Firebase SDK. Be sure to paste the configuration code into your web page as described.
Sign up new users
Create a form that allows new users to register with your app using their email
address and a password. When a user completes the form, validate the email
address and password provided by the user, then pass them to the
createUserWithEmailAndPassword
method:
firebase.auth().createUserWithEmailAndPassword(email, password).catch(function(error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
// ...
});
Sign in existing users
Create a form that allows existing users to sign in using their email address
and password. When a user completes the form, call the
signInWithEmailAndPassword
method:
firebase.auth().signInWithEmailAndPassword(email, password).catch(function(error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
// ...
});
Set an authentication state observer and get user data
For each of your app's pages that need information about the signed-in user, attach an observer to the global authentication object. This observer gets called whenever the user's sign-in state changes.
Attach the observer using the onAuthStateChanged
method. When a user
successfully signs in, you can get information about the user in the observer.
firebase.auth().onAuthStateChanged(function(user) {
if (user) {
// User is signed in.
var displayName = user.displayName;
var email = user.email;
var emailVerified = user.emailVerified;
var photoURL = user.photoURL;
var isAnonymous = user.isAnonymous;
var uid = user.uid;
var providerData = user.providerData;
// ...
} else {
// User is signed out.
// ...
}
});
Next steps
Learn how to add support for other identity providers and anonymous guest accounts: