登录前发送验证email

Question

这是我正在练习创建新用户的代码。 我可以收到 email 验证并确认它，但是，即使我尚未确认我的 email，该站点仍会登录我。

try{

      const { user } = await auth.createUserWithEmailAndPassword(email,password);
      await user.sendEmailVerification();
      await handleUserProfile(user, { displayName});

      this.setState({
        ...initialSate
      });

     }catch(err){
       console.log(err);
     }
  }

这是另一个 js 文件中的 handleUserProfile。

export const handleUserProfile = async (userAuth, additionalData) => {
    if (!userAuth) return;
    const {uid} = userAuth;

    const userRef = firestore.doc(`users/${uid}`);
        
    //create new user
    const snapshot = await userRef.get();
    if (!snapshot.exists){
        const { displayName, email} = userAuth;
        const timestamp = new Date();
        //if the user exist  does not exist
        try{
            await userRef.set({
                displayName,
                email,
                createdDate: timestamp,
                ...additionalData
            });

        }catch(err){
            console.log(err);
        }
    }
    return userRef;
};

Answer 1

firebase文档中解释了所有内容。 在那里，您可以尝试相应的代码片段。 您需要通过其中一些试验来缩小您的问题范围。 即使您有机会检查用户是否从注册 waas 的不同设备打开链接。

我认为这是您可能需要的片段：

// 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');
  }
  // The client SDK will parse the code from the link for you.
  firebase.auth().signInWithEmailLink(email, window.location.href)
    .then((result) => {
      // Clear email from storage.
      window.localStorage.removeItem('emailForSignIn');
      // You can access the new user via result.user
      // Additional user info profile not available via:
      // result.additionalUserInfo.profile == null
      // You can check if the user is new or existing:
      // result.additionalUserInfo.isNewUser
    })
    .catch((error) => {
      // Some error occurred, you can inspect the code: error.code
      // Common errors could be invalid email and invalid or expired OTPs.
    });
}

Answer 2

即使我还没有确认我的 email，该网站仍然会让我登录。

是的，这就是它在 Firebase 中的实现方式：开箱即用，没有任何东西可以阻止具有未经验证的 email 的用户对您的应用程序进行身份验证。

您应该通过以下方式自行管理：

1. 检查 email 在后端安全规则（Firestore、Cloud Storage 等）中得到验证。 例如，使用 function 如下：

---

function isVerifiedEmailUser() {
    return request.auth.token.email_verified == true;
}

---

2. 如果他/她的 email 未通过验证，可能会从您的应用程序中重定向并注销用户。 例如，在注册后，如下所示：

---

try {

       const { user } = await auth.createUserWithEmailAndPassword(email,password);
       await user.sendEmailVerification();
      
       if (user.emailVerified) {
             // display the content, redirect to another page, etc...
       } else {
            auth.signOut();   // Maybe call that after showing an error message
       }

     } catch(err){
         console.log(err);
     }
  }

另外，可能与signInWithEmailAndPassword()和onAuthStateChanged()类似。