Notes

Firebase Authentication
See the Firebase Authentication docs for web.
onAuthStateChanged
1
firebase.auth().onAuthStateChanged(currentUser => {
2
  if (currentUser) {
3
    // User is signed in.
4
  } else {
5
    // No user is signed in.
6
  }
7
});
Copied!
Register Email/Password
1
firebase.auth().createUserWithEmailAndPassword(email, password).catch(function(error) {
2
  // Handle Errors here.
3
  var errorCode = error.code;
4
  var errorMessage = error.message;
5
  // ...
6
});
Copied!
Sign In Email/Password
1
firebase.auth().signInWithEmailAndPassword(email, password).catch(function(error) {
2
  // Handle Errors here.
3
  var errorCode = error.code;
4
  var errorMessage = error.message;
5
  // ...
6
});
Copied!
Create Provider
Google
1
var provider = new firebase.auth.GoogleAuthProvider();
Copied!
Facebook
1
var provider = new firebase.auth.FacebookAuthProvider();
Copied!
Twitter
1
var provider = new firebase.auth.TwitterAuthProvider();
Copied!
GitHub
1
var provider = new firebase.auth.GithubAuthProvider();
Copied!
OAuth sign in with a provider
Popup
1
firebase.auth().signInWithPopup(provider);
Copied!
Redirect
1
firebase.auth().signInWithRedirect(provider);
Copied!
Phone Auth
First attach a recaptcha using an element ID...
1
window.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('sign-in-button', {
2
  'size': 'invisible',
3
  'callback': function(response) {
4
    // reCAPTCHA solved, allow signInWithPhoneNumber.
5
    onSignInSubmit();
6
  }
7
});
Copied!
... then capture a phone number from user input and send the sms...
1
var phoneNumber = getPhoneNumberFromUserInput();
2
var appVerifier = window.recaptchaVerifier;
3
firebase.auth().signInWithPhoneNumber(phoneNumber, appVerifier)
4
  .then(function (confirmationResult) {
5
    // SMS sent. Prompt user to type the code from the message, then sign the
6
    // user in with confirmationResult.confirm(code).
7
    window.confirmationResult = confirmationResult;
8
  }).catch(function (error) {
9
    // Error; SMS not sent
10
    // ...
11
  });
Copied!
...and finally authenticate with the code from user input.
1
var code = getCodeFromUserInput();
2
confirmationResult.confirm(code).then(function (result) {
3
  // User signed in successfully.
4
  var user = result.user;
5
  // ...
6
}).catch(function (error) {
7
  // User couldn't sign in (bad verification code?)
8
  // ...
9
});
Copied!

Firebase Authentication - Previous

Challenge

Next - Cloud Firestore

Introduction

Last modified 4yr ago

Copy link

Contents

Firebase Authentication

onAuthStateChanged

Create Provider

OAuth sign in with a provider

Phone Auth