Angular Firebase实现注册需管理员邮箱审核验证功能的咨询

1. 提前调整数据库字段 #

在Firestore的user集合文档中新增2个字段：

• isApproved：布尔类型，默认值为false，代表用户账号是否通过管理员审批
• approvalToken：字符串类型，用于校验管理员审批请求的合法性，避免恶意调用审批接口

2. 修改注册逻辑 #

取消原逻辑中给注册用户发送验证邮件的步骤，改为给管理员发送审批通知，新注册用户默认状态为待审批：

async register(){
    if(this.firstname && this.lastname && this.email && this.password){
      const loading =await this.loadingCtrl.create({
        message:'Processing...',
        spinner:'crescent',
        showBackdrop:true
      });
      loading.present();
      
      this.afauth.createUserWithEmailAndPassword(this.email,this.password)
      .then((data)=>{
        // 注释掉原给用户发送验证邮件的逻辑
        // data.user.sendEmailVerification();
        // 生成随机审批校验token
        const approvalToken = Math.random().toString(36).slice(2, 18);
        this.afs.collection('user').doc(data.user.uid).set({
          'userId':data.user.uid,
          'userEmail':this.email,
          'userFirstname':this.firstname,
          'userLastname':this.lastname,
          'isApproved': false,
          'approvalToken': approvalToken
        })
        .then(()=>{
          // 此处调用你的邮件发送能力，给管理员邮箱发送审批通知
          // 通知内需包含用户注册信息、审批链接，链接携带userId和approvalToken参数
          sendApprovalMailToAdmin({
            userInfo: `${this.firstname} ${this.lastname}(${this.email})`,
            approveUrl: `你的审批后台地址/approve?userId=${data.user.uid}&token=${approvalToken}`
          })
          loading.dismiss();
          this.toast('注册申请已提交，等待管理员审批后即可登录','success');
          this.router.navigate(['/login']);
        })
        .catch(error=>{
          loading.dismiss();
          this.toast(error.message,'danger')
        })
      })
    }
  }

3. 修改登录校验逻辑 #

在原有邮箱验证判断的基础上，新增账号审批状态校验，未通过审批的账号不允许登录：

async SignIn(email,password)
{
 const loading =await this.LoadingCtrl.create({
   message:'Authenticating..',
   spinner:"crescent",
   showBackdrop:true
 });
 loading.present();
 this.afauth.setPersistence(firebase.default.auth.Auth.Persistence.LOCAL)
 .then(()=>{
   this.afauth.signInWithEmailAndPassword(email,password)
   .then(async (data)=>{
     // 查询对应用户的审批状态
     const userSnapshot = await this.afs.collection('user').doc(data.user.uid).get().toPromise();
     const userInfo = userSnapshot.data();
     // 新增isApproved状态校验
     if(!data.user.emailVerified || !userInfo?.isApproved){
       loading.dismiss();
       if(!userInfo?.isApproved) {
         this.toast('账号尚未通过管理员审批，请耐心等待','warning');
       } else {
         this.toast('请检查你的登录凭证','warning');
       }
       this.afauth.signOut();
     }else{
       loading.dismiss();
       this.router.navigate(['/home']);
     }
   })
   .catch(error=>{
     loading.dismiss();
     this.toast(error.message,'danger');
   })
 })
 .catch(error=>{
   loading.dismiss();
   this.toast(error.message,'danger');
 });
} 

4. 补充管理员审批逻辑 #

你需要额外实现审批接口能力：

• 管理员点击邮件中的审批链接后，后端/云函数先校验userId对应的approvalToken是否匹配
• 校验通过后将对应user文档的isApproved字段改为true，可同时调用Firebase Admin SDK将用户的emailVerified设为true，省去用户自行验证邮箱的步骤
• 审批完成后可给用户发送通知邮件，告知注册已通过可正常登录

内容的提问来源于stack exchange，提问作者Notation