使用Azure B2C内置用户流收集DOB及确保用户名唯一性问题

一、出生日期（DOB）收集与年龄验证 #

内置用户流无原生DOB属性，但可通过自定义属性+客户端验证实现，无需自定义策略：

1. 创建自定义DOB属性：
   • 登录Azure B2C租户，进入「用户属性」，点击「添加」，设置名称为DOB，类型选择「日期」后保存。
2. 在用户流中配置DOB属性：
   • 打开目标注册用户流，进入「用户属性」标签，勾选刚创建的DOB属性；再切换到「应用声明」标签，同样勾选DOB，确保该属性能返回给业务应用。
3. 添加客户端JavaScript年龄验证：
   • 在用户流的「属性」设置中，开启「启用JavaScript」，并将页面布局版本设为2.1.0或更高。
   • 自定义注册页面的验证逻辑，拦截表单提交并校验年龄：

     document.addEventListener('DOMContentLoaded', function() {
       const dobInput = document.querySelector('input[name="extension_DOB"]');
       const registerForm = document.querySelector('form');
       
       registerForm.addEventListener('submit', function(e) {
         const dob = new Date(dobInput.value);
         const today = new Date();
         let userAge = today.getFullYear() - dob.getFullYear();
         const monthGap = today.getMonth() - dob.getMonth();
         
         // 修正未到生日的年龄计算
         if (monthGap < 0 || (monthGap === 0 && today.getDate() < dob.getDate())) {
           userAge--;
         }
         
         if (userAge < 18) {
           e.preventDefault();
           alert('必须年满18周岁才能完成注册');
         }
       });
     });
     

   注意：客户端验证仅为前端拦截，若需严格的服务器端校验，最终仍需使用自定义策略。

二、用户名唯一性验证 #

内置用户流无原生唯一性检查，可通过两种客户端方案实现：

方案1：实时前端校验（调用Microsoft Graph API） #

1. 在Azure AD中注册后端应用，授予User.Read.All应用权限，获取合法的访问令牌。
2. 在注册页面前端，监听用户名输入框的blur事件，调用Graph API的GET /users?$filter=userPrincipalName eq '{输入的用户名}'（若使用自定义属性存储用户名，替换为extension_CustomUsername eq '{输入的用户名}'），检查是否存在重复用户。
3. 若API返回非空结果，立即提示用户“该用户名已被使用，请更换”并阻止表单提交。

方案2：提交后错误捕获 #

当用户提交注册时，若用户名（如userPrincipalName）重复，Azure B2C会返回错误代码AADB2C90077。在前端捕获该错误并提示用户：

// 处理B2C注册回调中的错误
function handleRegError(error) {
  if (error.errorDescription.includes('AADB2C90077')) {
    alert('该用户名已存在，请更换后重试');
  }
}

此方案无需额外API调用，但验证时机在表单提交后，用户体验略逊于实时校验。

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