Firebaseでメールアドレス、パスワード入力なしで「emailVerified」をtrueにする方法

皆さんこんにちは！

今日は、FirebaseのemailVerifiedについて書いていきます。

このemailVerifiedはメール認証を行っているかを示すものです。

これでユーザーの動作やページの制御を行えます。

これを行うにはsendEmailVerificationと言う関数を用いるのですが、通常メールアドレスとパスワードの入力を要求されます。

ユーザーからしたらめんどくさいですよね。

また、emailVerifiedはフロントからは変更を行うことができません。

それをメールに送ったリンクをクリックしたらメール認証完了という感じにしたいと思います。

それではやっていきましょう！

FirebaseFunctionsの設定

最初にFirebaseFunctionsで独自の関数を作成していきます。

functins/index.js

const functions = require('firebase-functions')
const admin = require('firebase-admin')

admin.initializeApp()

// メールアドレス認証（emailVerified）の更新
exports.updateEmailVerified = functions.region('asia-northeast1').https.onCall((data, context) => {
  const uid = context.auth.uid
  if (!uid) {
    return
  }
  admin
    .auth()
    .updateUser(uid, {
      emailVerified: true
    })
    .then()
})

このupdateUserでemailVerifiedをtrueにすることができます。

メール認証を行うメールの送信

      const actionCodeSettings = {
        url: window.location.origin + '/actionemailverified',
        handleCodeInApp: true
      }
      const user = this.$auth.currentUser
      // メール送信
      await user
        .sendEmailVerification(actionCodeSettings)
        .then(() => {
          //
        })
        .catch((error) => {
          //
        })

アクションコードの設定などは、下記の記事に詳しく書いているので是非ご覧ください。

Firebase初心者向け！Firebaseでパスワードを使わずにメールリンク認証を行う方法

関数の呼び出し

sendEmailVerificationで送信したURL先でfunctions\index.jsで定義した関数を呼び出します。

action.js

      const func = this.$function.httpsCallable('updateEmailVerified')
      func()
        .then(() => {
          alert('メール認証が完了しました')
          user.reload()
        })
        .catch((error) => {
          //
        })

いかがだったでしょうか？

ちなみにメールアドレスを変更した際は、自動的にemailVerifiedはfalseになりますのでユーザーには再度認証を行ってもらう必要があります。

このようにしてemailVerifiedを更新することができます。

あまり情報がなかったので書いておきました。

皆さんのお力になれれば幸いです。

以上、「Firebaseでメールアドレス、パスワード入力なしで「emailVerified」をtrueにする方法」でした！

良ければ、LGTM、コメントお願いします。

また、何か間違っていることがあればご指摘頂けると幸いです。

他にも毎日初心者さん向けに記事を投稿しているので、時間があれば他の記事も見て下さい！！

Thank you for reading