autocomplete="off"在现代浏览器中基本失效，因Chrome、Firefox等自2020年起主动忽略该属性以保障密码管理体验；应改用autocomplete="new-password"等规范值并配合混淆name/type等实操方案。
autocomplete="off" 在现代浏览器里基本失效
Chrome、Firefox、Edge 等主流浏览器从 2020 年起已明确忽略 autocomplete="off" 对密码类字段（如 type="password"）和敏感文本字段（如 type="text" 但 name 含 cc-number、cvv、email 等）的设置。不是你写错了，是浏览器故意不认。
根本原因：浏览器优先保障用户密码管理体验，且认为开发者滥用 autocomplete="off" 反而损害安全性（比如强制用户手输密码导致弱密码或复用）。
- Chrome 会无视
autocomplete="off"，但可能尊重autocomplete="new-password"（用于注册/改密场景） - Firefox 对
autocomplete="off"的处理更宽松些，但仍可能基于字段语义（如name="cardNumber"）触发自动填充 - Safari 会严格按 WHATWG 规范解析 autocomplete 值，
"off"不在合法枚举值中，直接当作无效
真正能绕过自动填充的实操方案
核心思路：让浏览器“认不出这是敏感字段”。不是靠禁用，而是靠混淆或延迟绑定。
- 把
type="password"暂时改成type="text"，在 focus 时再切回password—— 浏览器通常只对初始type="password"做密码管理 - 动态生成
name和id，比如用随机字符串：name="pwd_8a3f"，避免匹配常见敏感字段名（password、pass、pw） - 用
autocomplete="new-password"替代"off"—— 这是规范支持的合法值，Chrome 会将其视为“新密码输入”，不填旧密码，也不保存本次输入 - 对银行卡号等字段，用
autocomplete="cc-number"是反效果的（明示敏感类型），应改用无意义值如autocomplete="section-credit-card number"（注意空格，部分浏览器会因此跳过识别）
服务端敏感字段必须二次校验
前端所有 autocomplete 技巧都只是防误填，不是安全边界。浏览器仍可能把值塞进 input，用户也可能粘贴、脚本注入、绕过 JS。
- 任何含卡号、CVV、身份证号、密码的字段，服务端必须做格式校验 + 敏感词过滤 + 长度限制（如 CVV 必须是 3–4 位数字）
- 不要依赖
autocomplete值判断字段是否被自动填充；要用服务端逻辑识别异常模式（如连续多条请求含相同 CVV+不同卡号） - 若字段用于支付，务必启用 PCI DSS 合规的表单方案（如 Stripe Elements、Checkout.js），它们根本不让敏感数据经过你的服务器
为什么 autocomplete="new-password" 比 "off" 更可靠
autocomplete="new-password" 是 WHATWG HTML 标准明确定义的合法值，语义清晰：这是一个需要新密码的场景（如注册、重置），不应使用已保存的密码，也不应保存本次输入。
- Chrome 会清空该字段的自动填充候选，并在提交后忽略存储
- Firefox 和 Safari 也已实现该行为，兼容性比
"off"好得多 - 注意：它只对
type="password"有效；对type="text"字段设此值无实际作用 - 别写成
autocomplete="new_password"或"newpassword"—— 下划线、驼峰、缺短横线都会导致浏览器当作文本值忽略
真正难的不是加个属性，而是接受一个事实：浏览器控制着密码输入体验，你能做的，是配合它的规则，而不是对抗它。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
