HTML仅负责实名认证的前端表单呈现与输入收集，需配合后端服务及第三方SDK完成真实核验；其核心是设计含real_name、id_card等name属性的表单，用inputmode="numeric"、maxlength="18"及正则初步校验身份证号，但不可替代公安接口权威验证。
HTML 本身不能做实名认证——它只是静态标记语言，不处理身份核验、身份证 OCR、公安接口调用或银行卡四要素验证。所谓“HTML 实名认证流程”，实际是前端表单 + 后端服务 + 第三方认证 SDK 的协同结果，HTML 只负责呈现和收集用户输入。
怎么写实名认证的前端表单（input 类型与校验逻辑）
表单是用户第一触点，但光靠 required 或 pattern 无法保证真实性，只能防误输。
-
idCard输入框建议用inputmode="numeric"+maxlength="18"，配合前端简单校验（如正则/^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/），但该正则仅筛明显错误，不替代权威核验 -
realName需限制为中文或中英文混合（[\u4e00-\u9fa5a-zA-Z\s]{2,20}），禁用 emoji 和控制字符 - 姓名与身份证号必须用
name属性明确标识（如name="real_name"、name="id_card"），否则后端收不到字段 - 避免在前端做「身份证号脱敏显示」时直接操作 DOM 内容，应由后端返回已脱敏值，防止 JS 被篡改绕过
为什么不能只用 fetch 提交到自己后端就完事？
提交成功 ≠ 认证通过。公安/运营商/银联等实名接口要求严格鉴权，且多数不支持跨域直连。
- 浏览器端直接
fetch调用公安接口会触发 CORS 错误，且密钥绝不能暴露在前端（Authorization头、app_secret等必须由后端保管） - 第三方 SDK（如支付宝实人认证、腾讯云慧眼）通常提供 Web SDK：需后端先调用
/api/auth/init获取token，再在前端初始化AlipaySDK.start()，整个活体检测过程由 SDK 控制，结果回调到你指定的onSuccess函数 - 若跳转 H5 认证页（如银行联合登录），注意
referer必须在白名单内，否则页面直接拒绝加载
form 提交后没反应？检查这三点
常见静默失败，不是代码写错，而是链路卡在非前端环节。
- 确认后端接口返回的是标准 HTTP 状态码：
200表示接收成功，但响应体里{"code":200,"data":{"status":"PENDING"}}才代表进入审核；400常因身份证号格式合法但姓名不匹配（如曾用名未更新） - 检查
enctype：上传身份证照片时必须设为enctype="multipart/form-data"，否则file字段为空 - 移动端 iOS Safari 对
input[type="file"]有额外限制：需添加accept="image/*" capture="environment"才能调起后置摄像头，否则只弹相册
真正难的不是写出表单，而是理解每个字段背后对应哪一层校验：前端正则拦错字、后端签名保安全、第三方 SDK 做活体、公安库比对算终审。漏掉任意一环，用户都会卡在「提交成功，但认证失败」的黑盒里。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
