基于Web的Twilio 2FA系统：如何实现iPhone端短信验证码自动填充

一、修正短信格式 #

iOS的AutoFill验证码功能有严格的识别规则，不是随便加个@域名就行，得按苹果的规范来：

• 短信里必须明确出现「验证码」「Verification code」这类关键词，让系统知道这是验证用的数字
• 要包含和你登录页面完全匹配的域名，格式是@yourdomain.com，比如你登录页是https://auth.yourapp.com，短信里就要写@auth.yourapp.com或者@yourapp.com
• 验证码数字要和域名放在同一条短信里，位置尽量靠近
• 正确示例：【你的平台名】登录验证码：654321 @yourapp.com
• 别用奇怪的特殊符号打乱格式，Twilio发送时要确保短信内容完整，没有被分段截断

二、网页输入框加必要属性 #

网页端的验证码输入框必须告诉iOS「我是用来填一次性验证码的」，添加两个关键属性：

• autocomplete="one-time-code"：这是触发AutoFill的核心属性
• inputmode="numeric"：让iOS自动弹出数字键盘，优化体验
• 代码示例：

<input type="text" name="verification_code" autocomplete="one-time-code" inputmode="numeric" placeholder="请输入6位验证码">

三、额外要检查的点 #

• 网站必须是HTTPS：iOS的AutoFill只在加密的HTTPS站点上生效，HTTP环境下完全不会触发
• 核对域名一致性：短信里的域名必须和登录页面的主域名一致，子域名也算匹配，比如app.yourdomain.com和yourdomain.com是兼容的，但otherdomain.com就不行
• 检查系统设置：让用户确认iPhone的「设置-密码-自动填充密码」已经开启，并且允许你的网站使用该功能

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