如何在主要浏览器中禁用特定输入(或表单字段)的自动完成?


当前回答

我通过添加两个假输入并赋予它们绝对位置来阻止Chrome 66自动填充:

<form style="position: relative">
  <div style="position: absolute; top: -999px; left: -999px;">
    <input name="username" type="text" />
    <input name="password" type="password" />
  </div>
  <input name="username" type="text" />
  <input name="password" type="password" />

起初,我尝试添加display:none;但Chrome忽略了这些输入,并自动填充可见的输入。

其他回答

我不得不对那些说要避免禁用自动完成的答案表示异议。

首先要指出的是,未在登录表单字段上显式禁用自动完成是PCI-DSS失败。此外,如果用户的本地计算机受到威胁,则攻击者可以轻松地获取任何自动完成的数据,因为这些数据存储在明文中。

当然,可用性是有争议的,但在哪些表单字段应该禁用自动完成功能,哪些表单字段不应该禁用自动填写功能时,存在一个非常好的平衡。

我真不敢相信,这件事被报道了这么久,仍然是一个问题。以前的解决方案对我来说不起作用,因为Safari似乎知道元素何时不显示或不在屏幕上,但下面的解决方案确实对我起作用:

<div style="height:0px; overflow:hidden; ">
  Username <input type="text" name="fake_safari_username" >
  Password <input type="password" name="fake_safari_password">
</div>

如果删除表单标记,则可以禁用自动完成。

我的银行也是这样做的,我想知道他们是怎么做到的。它甚至会删除删除标记后浏览器已经记住的值。

除了设置autocomplete=off之外,您还可以通过生成页面的代码随机化表单字段名称,或者在名称末尾添加一些特定于会话的字符串。

提交表单后,您可以在服务器端处理表单之前剥离该部分。这将阻止web浏览器查找字段的上下文,也可能有助于防止XSRF攻击,因为攻击者无法猜测表单提交的字段名称。

我的问题主要是Chrome自动填充,但我认为这可能比自动完成问题更大。

技巧:使用计时器重置表单并将密码字段设置为空白。100毫秒的持续时间似乎是它工作的最短时间。

$(document).ready(function() {
    setTimeout(function() {
        var $form = $('#formId');
        $form[0].reset();
        $form.find('INPUT[type=password]').val('');
    }, 100);
});