Help us understand the problem. What is going on with this article?

Firebase Authentication これだけは覚えておけ!テストに出るぞ!

More than 3 years have passed since last update.

ユーザー登録やログインはどんなWebアプリケーションでもほぼ必須なのに、いざ実装するとなるといろいろ考えることが多くて(主にパスワードの保存方法とか漏洩対策とか)正直しんどい。
Firebaseには最初からメールアドレスとパスワードを使ったユーザー認証の仕組みが用意されていて、プロジェクトを作って管理コンソールで有効にするだけですぐに利用することができる。ここの仕組みだけでもFirebaseを使う価値は十分にあるかもしれない。

サインイン

メールアドレスとパスワードを使ったサインインの実装。

// なんらかの方法でユーザーの入力したユーザー名とパスワードを取得する。
// 例:
let email = document.getElementById('input-email').value;
let password = document.getElementById('input-password').value;

firebase.auth().signInWithEmailAndPassword(email, password)
  .then(user => {
    // ログイン成功
    // ページを移動する、ユーザーの情報を取得して処理を行う、等する
    // user.uid をユーザーIDとして使用する
  }, err => {
    // エラーを表示する等
  });

サインアウト

サインインをするということは、サインアウトもしなければいけないだろう。

firebase.auth().signOut()
  .then(_ => {
    // ログイン画面に戻る等
  }, err => {
    // エラーを表示する等
  });

現在サインインしているかどうかを判定する

マイページのような機能は、サインインしている状態でアクセスしなければならない。サインインをしていない状態だったらサインインする画面に遷移させたりしたい。

firebase.auth().onAuthStateChanged((user) => {
  if (!user) {
    // サインインしていない状態
    // サインイン画面に遷移する等
    // 例:
    location.href = '/signin.html';
  } else {
    // サインイン済み
  }
});

作っているのが社内用アプリだったりテスト用だったりする場合は、ひとまずこれくらい押さえておけば大丈夫だ!

あとは公式のドキュメント見てください。
https://firebase.google.com/docs/auth/web/password-auth

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away