Safari 自动填充隐藏的“重置密码令牌”输入答案

【问题标题】：Safari autofills hidden "reset password token" inputSafari 自动填充隐藏的“重置密码令牌”输入
【发布时间】：2017-11-21 09:58:47
【问题描述】：

Safari 实际上正在用我的电子邮件地址覆盖一个隐藏的表单字段，该字段应该表示密码重置令牌（ID 为 user_reset_password_token，名称为 user[reset_password_token]）。

你可以想象，当令牌不正确时，重置密码不起作用，所以我遇到了一个问题。

我已经确认，如果我在 Safari 中禁用自动填充，或者使用 Safari 以外的任何浏览器，它都可以正常工作。

有人有解决这个问题的办法吗？

【问题讨论】：

【解决方案1】：

刚刚遇到同样的问题。我解决了将readonly 属性添加到隐藏输入的问题，如下所示：

= f.hidden_field :reset_password_token, readonly: true

所以我有这个：

<input id="user_reset_password_token" name="user[reset_password_token]" readonly="readonly" type="hidden" value="YXHRuRgppyzxqsdEXiNm">

【讨论】：

【解决方案2】：

没有真正干净的方法可以做到这一点。一种解决方法是在此之前有一个假输入，以便 safari 将自动填充它而不是您的输入。像这样的想法，例如：

<input id="fake_password" name="fake_user[password]" style="position:absolute; top:-100px;" type="text" value="Safari Autofill Me">

top-100px 用于隐藏此输入，因为 display:none 在某些情况下会阻止自动填充...

【讨论】：

【解决方案3】：

禁用隐藏字段的自动完成功能：

HTML：

<input name="reset_password_token" type="hidden" autocomplete="off">

Rails（使用表单助手）：

<%= f.hidden_field :reset_password_token, autocomplete: 'off' %>

【讨论】：

【解决方案4】：

在输入端设置 readonly 和 autocomplete=off 属性在 iOS 上的 Safari 中不起作用。我们必须在表单中添加一个onSubmit 回调，用正确的值替换该值。它很丑，但它修复了错误。

【讨论】：