Firebase 电子邮件链接身份验证

Question

我正在为一个项目使用无密码身份验证，一切都按预期工作，但是我有一个关于此身份验证的问题。我会谈谈场景。

第一步：众所周知，新用户需要一封电子邮件，然后继续点击链接登录。

这是正常情况，没问题，但是如果用户已经完成了该步骤并说他/她从应用程序中注销怎么办？似乎他们需要再次执行我上面描述的第一步。

这是我迄今为止尝试过的：

login() {
    const email = this.email;
    this.$store
      .dispatch("LOGIN", { email })
      .then(resp => {
        this.$router.replace("/");
      })
      .catch(err => {
        this.autherror = true, 
        this.errorMessage = err.message;
      });
  }

LOGIN: ({ commit }, user) => {

      return new Promise((resolve, reject) => {
        // commit(AUTH_REQUEST)
        firebase.auth().signInWithEmailLink(user.email, window.location.href)
        .then((result) => {

          window.localStorage.removeItem("emailForSignIn");
          resolve(result);
        })
        .catch((err) => {
          reject(err);
          // Some error occurred, you can inspect the code: error.code
          // Common errors could be invalid email and invalid or expired OTPs.
        });
      });
    },

我会得到一个错误“无效的电子邮件链接！”尝试上面的代码，即使我把url作为我以前登录的那个，它也会抛出一个错误 “操作代码无效。如果代码格式错误、过期或已被使用，则可能发生这种情况”

我可以理解为什么总是需要电子邮件登录，但我想说的是，如果用户首先从链接登录然后注销，他们可以登录应用程序而无需再做第一步，怎么样？这意味着如果有办法将凭据存储在 cookie/localstorage 中，并且他们需要再次执行第一步的唯一时间是他们是否从所有需要的特定应用程序/页面中清除 cookie、存储等。

那么有可能吗？这肯定会改善用户体验。

Answer 1

您应该阅读并了解用户在 Firebase 中的工作方式（在任何 oAuth 类型验证系统中基本相同）-https://firebase.google.com/docs/auth/users

更具体地说，如何使用电子邮件 - https://firebase.google.com/docs/auth/web/email-link-auth

在您的代码中，您应该使用上面参考中所示的电子邮件确认步骤（因此，类似于下面的代码 - 您可能需要进行一些小的更改以适应您的本地情况）：

LOGIN: ({ commit }, user) => {

  return new Promise((resolve, reject) => {
   // Confirm the link is a sign-in with email link.
   if (firebase.auth().isSignInWithEmailLink(window.location.href)) {
      // Additional state parameters can also be passed via URL.
      // This can be used to continue the user's intended action before triggering
      // the sign-in operation.
      // Get the email if available. This should be available if the user completes
      // the flow on the same device where they started it.
      var email = window.localStorage.getItem('emailForSignIn');
      if (!email) {
        // User opened the link on a different device. To prevent session fixation
        // attacks, ask the user to provide the associated email again. For example:
        email = window.prompt('Please provide your email for confirmation');
      }
    // commit(AUTH_REQUEST)
    firebase.auth().signInWithEmailLink(email, window.location.href)
    .then((result) => {

      window.localStorage.removeItem("emailForSignIn");
      resolve(result);
    })
    .catch((err) => {
      reject(err);
      // Some error occurred, you can inspect the code: error.code
      // Common errors could be invalid email and invalid or expired OTPs.
    });
  });
}
},