WebTecNote

[JS] Firebaseの覚書 ④ 認証エラーメッセージの日本語化

公式で多言語対応されてないから自分で翻訳しないとだった。

Firebase Auth
signInWithEmailAndPassword
signInWithCredential
signInWithPopup
signInWithRedirect
reauthenticateWithCredential
reauthenticateWithPopup
fetchSignInMethodsForEmail
あたりの認証メソッド使っててお目に掛かるエラーはだいたいこのような内容。

// ex:
// import firebaseError form 'firebase/error';
// firebaseError(e, 'signin');

export default (e, method) => {
  switch (e.code) {
    case 'auth/cancelled-popup-request':
    case 'auth/popup-closed-by-user':
       return null;
    case 'auth/email-already-in-use':
      if (method.indexOf('signup') !== -1) {
        return 'このメールアドレスは使用されています';
      } else {
        return 'メールアドレスまたはパスワードが違います';
      }
    case 'auth/invalid-email':
      return 'メールアドレスの形式が正しくありません';
    case 'auth/user-disabled':
      return 'サービスの利用が停止されています';
    case 'auth/user-not-found':
      return 'メールアドレスまたはパスワードが違います';
    case 'auth/user-mismatch':
      if (method === 'signin/popup') {
        return '認証されているユーザーと異なるアカウントが選択されました';
      } else {
        return 'メールアドレスまたはパスワードが違います';
      }
    case 'auth/weak-password':
      return 'パスワードは6文字以上にしてください';
    case 'auth/wrong-password':
      return 'メールアドレスまたはパスワードが違います';
    case 'auth/popup-blocked':
      return '認証ポップアップがブロックされました。ポップアップブロックをご利用の場合は設定を解除してください';
    case 'auth/operation-not-supported-in-this-environment':
    case 'auth/auth-domain-config-required':
    case 'auth/operation-not-allowed':
    case 'auth/unauthorized-domain':
      return '現在この認証方法はご利用頂けません';
    case 'auth/requires-recent-login':
      return '認証の有効期限が切れています';
    default:
      if (method.indexOf('signin') !== -1) {
        return '認証に失敗しました。しばらく時間をおいて再度お試しください';
      } else {
        return 'エラーが発生しました。しばらく時間をおいてお試しください';
      }
  }
};

ポップアップ認証固有のエラー

auth/cancelled-popup-requestauth/popup-closed-by-userは、ポップアップ認証利用時にポップアップが閉じられた時やポップアップでの処理が中断した時に出る。

Firebase側設定起因のエラー

auth/wrong-password

このエラーはGoogle認証でアカウント作成したユーザーがメールアドレス&パスワードでログインを試みようとした場合にも出る。

auth/user-not-found

実際はアカウントが存在しないというエラー。

auth/email-already-in-use

1メールアドレス1アカウント設定である時に入力されたメールアドレスが利用済みの場合に出る。
これもぼかし対象のエラーだが、登録の時だけ重複を告げるエラーの方がユーザーには分かりやすいと思う。

auth/account-exists-with-different-credential

このエラーはOAuth系で認証時に同じメアドを使って作成されたアカウントが存在する場合に出る。

エラーメッセージで認証方法を出す例:

firebase.auth()
  .fetchSignInMethodsForEmail(e.email)
  .then(providers => {
    return `${e.email}は「${providers
        .map(provider => providerName(provider))
        .join(
          ','
        )}」で認証されています。同じ認証方法でログインしてください`
    });
  });

function providerName (name) {
  switch (name) {
    case 'google.com':
      return 'Google';
    case 'twitter.com':
      return 'Twitter';
    case 'facebook.com':
      return 'Facebook';
    case 'password':
      return 'メールアドレス&パスワード';
    case 'emailLink':
      return 'メールリンク';
  }
}
モバイルバージョンを終了