Azure ADB2C无密码认证输入手机号时未弹出数字键盘如何解决？

该问题的核心原因是B2C默认的手机号输入字段未配置正确的HTML5输入属性，移动端无法识别输入场景，因此弹出全键盘，你可以根据你使用的B2C配置类型选择对应方案：

方案1：内置用户流配置 #

• 进入Azure门户，定位到你的AD B2C资源
• 打开正在使用的无密码认证用户流，进入「页面布局」配置页
• 选择对应的无密码登录/注册页面，找到用户属性下的「手机号」字段，点击编辑
• 在字段的自定义属性中添加两项配置：
  • 将type属性设置为tel
  • 新增inputmode属性，值设置为numeric
• 保存配置并重新发布用户流，清理缓存后测试即可生效

方案2：自定义策略（IEF）配置 #

• 找到你自定义策略文件中定义手机号声明的ClaimType节点，一般位于扩展文件的ClaimsSchema模块下
• 修改节点配置，新增输入属性元数据，参考配置如下：

<ClaimType Id="phoneNumber">
  <DisplayName>手机号</DisplayName>
  <DataType>String</DataType>
  <UserInputType>PhoneNumber</UserInputType>
  <Restriction>
    <Pattern RegularExpression="^[0-9]*$" HelpText="请输入合法的手机号" />
  </Restriction>
  <Metadata>
    <Item Key="inputType">tel</Item>
    <Item Key="inputmode">numeric</Item>
    <Item Key="pattern">[0-9]*</Item>
  </Metadata>
</ClaimType>

• 上传更新后的策略文件即可生效

方案3：自定义UI模板配置 #

如果你使用了完全自定义的HTML作为B2C的用户界面，直接修改手机号输入框的标签属性即可：

<input type="tel" id="phoneNumber" name="phoneNumber" inputmode="numeric" pattern="[0-9]*" placeholder="请输入手机号">

部分旧版移动端浏览器对inputmode属性兼容性有限，额外添加pattern="[0-9]*"属性可兼容更多设备场景

问题场景参考截图 #

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