如何禁用Web表单域/input标签上的浏览器自动完成?

如何在主要浏览器中禁用特定input (或form field )的autocomplete

Firefox 30会忽略密码的autocomplete="off" ,select提示用户密码是否存储在客户端。 请注意以下2014年5月5日的评论 :

  • 密码pipe理器总是提示是否要保存密码。 密码未经用户许可不得保存。
  • 在IE和Chrome之后,我们是第三个实现这个改变的浏览器。

根据Mozilla开发者文档 ,表单元素属性autocomplete可防止表单数据在旧浏览器中被caching。

 <input type="text" name="foo" autocomplete="off" /> 

除了autocomplete=off ,还可以通过生成页面的代码对表单字段名称进行随机化,也许可以在名称的末尾添加一些会话特定的string。 表单提交后,可以在服务器端处理它们之前off该部分。 这将阻止Web浏览器为您的字段查找上下文,也可能有助于防止XSRF攻击,因为攻击者无法猜测表单提交的字段名称。

大多数主stream浏览器和密码pipe理器(正确的,恕我直言)现在忽略autocomplete=off

为什么? 许多银行和其他“高安全性”网站为了安全目的在他们的login页面上添加了autocomplete=off ,但是这实际上降低了安全性,因为它使得人们在这些高安全性网站上更改密码以易于记住(并因此破解)因为自动完成已被破坏。

很久以前,大多数密码pipe理器开始忽略autocomplete=off ,现在浏览器开始只对用户名/密码input做同样的事情。

不幸的是,自动完成实现中的错误会将用户名和/或密码信息插入到不适当的表单字段中,导致表单validation错误,或者更糟糕的是,意外地将用户名插入到用户故意留空的字段中。

什么是Web开发人员要做的?

  • 如果您可以自己保留所有密码字段,那么这是一个好的开始,因为密码字段的存在似乎是用户/通过自动填充的主要触发器。否则,请阅读下面的提示。
  • 在这种情况下, Safari注意到有2个密码字段并禁用了自动完成function,假设它必须是更改密码表单,而不是login表单。 因此,只要确保在允许的情况下使用任何forms的2个密码字段(新的和确认新的)
  • 不幸的是, Chrome 34会尝试自动填充字段与用户/通过每当它看到一个密码字段。 这是一个非常糟糕的错误,希望他们会改变到Safari的行为。 但是,将其添加到表单的顶部似乎禁用密码自动填充:

     <input type="text" style="display:none"> <input type="password" style="display:none"> 

我还没有彻底调查IE或Firefox,但如果其他人在评论中有信息,我会很乐意更新答案。

有时, 即使自动完成=closures不会阻止将凭据填入错误的字段,而不是用户或昵称字段。

这个解决方法是除了apinstein有关浏览器行为的文章外。

修复浏览器自动填写:只读,并设置焦点(单击和选项卡)

  <input type="password" readonly onfocus="this.removeAttribute('readonly');"/> 

更新:移动Safari在字段中设置光标,但不显示虚拟键盘。 新的修复工作像以前一样,但处理虚拟键盘:

 <input id="email" readonly type="email" onfocus="if (this.hasAttribute('readonly')) { this.removeAttribute('readonly'); // fix for mobile safari to show virtual keyboard this.blur(); this.focus(); }" /> 

现场演示https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

因为,浏览器自动填充凭据到错误的文本字段!

我注意到Chrome和Safari上的这种奇怪的行为,当有相同的forms的密码字段 我想,浏览器查找密码字段来插入您保存的凭据。 然后它自动填充(只是猜测由于观察)最近的textlikeinput字段,出现在DOM中的密码字段之前。 由于浏览器是最后一个实例,您无法控制它,

这只读修复上面为我工作。

 <form name="form1" id="form1" method="post" autocomplete="off" action="http://www.example.com/form.cgi"> 

这将在IE和FF中工作,缺点是它不是XHTML标准。

正如其他人所说,答案是autocomplete="off"

不过,我认为值得说明的是, 为什么在某些情况下使用它是一个好主意,因为有些答案和重复的问题表明最好不要closures。

停止存储信用卡号码的浏览器不应该留给用户。 太多的用户甚至不会意识到这是一个问题。

closures信用卡安全密码字段尤其重要。 正如本页所述

“不要存储安全码……它的价值取决于推定提供它的唯一方法是从实际的信用卡上读取它,certificate提供它的人实际上持有该卡。

问题是,如果是公用计算机(网吧,图书馆等),那么其他用户就很容易窃取你的卡片细节,甚至在你自己的机器上,恶意网站可能会窃取自动完成的数据 。

Chrome的解决scheme是将autocomplete="new-password"到inputtypes密码。

例:

 <form name="myForm"" method="post"> <input name="user" type="text" /> <input name="pass" type="password" autocomplete="new-password" /> <input type="submit"> </form> 

如果Chromefind一个types为password的密码箱,那么它会自动完成数据的自动填充,刚好足以指示该autocomplete = "new-password"箱的autocomplete = "new-password"

这对我很好。

注意:确保你的修改生效,很多时候浏览器把页面保存在caching中,这给我留下了一个不好的印象,那就是它没有起作用,但是浏览器并没有真正带来这些变化。

我不得不乞求不同的回答说,以避免禁用自动完成。

首先要提出的是,在login表单字段中不显式禁用自动完成是PCI-DSS失败。 另外,如果用户的本地机器受到攻击,那么任何自动完成的数据都可以被攻击者轻易获得,因为它被存储在明文中。

当然有一个可用性的论点,但是当涉及到哪些表单字段应该禁用自动完成function而哪些不应该的时候,就会有非常好的平衡。

三个选项:第一:

 <input type='text' autocomplete='off' /> 

第二:

 <form action='' autocomplete='off'> 

第三(javascript代码):

 $('input').attr('autocomplete', 'off'); 

我一直在尝试无尽的解决scheme,然后我发现这个:

而不是autocomplete="off"只是简单地使用autocomplete="false"

就这么简单,它在谷歌浏览器中的魅力也是如此!

只需设置autocomplete="off" 。 有这样一个非常好的理由:你想提供自己的自动完成function!

如果您是上述表单的用户,并希望重新启用自动填充function,请使用此Bookmarklet页面中的“记住密码”书签。 它从页面上的所有表单中删除所有“autocomplete =”off“”属性。 继续奋斗吧!

我们确实使用sasb的一个网站的想法。 这是一个运行医生办公室的医疗软件networking应用程序。 然而,我们的许多客户是外科医生,他们使用了许多不同的工作站,包括半公共terminal。 所以,他们想要确保一个不懂自动保存密码或者不注意的医生不会意外地将他们的login信息轻松地存取。 当然,这是在IE8,FF3.1等已经开始使用隐私浏览的想法之前。即便如此,许多医生也不得不在医院中使用旧式浏览器,而这些浏览器不会改变。

所以,我们有login页面生成随机字段名称,只能为该职位工作。 是的,这样做不太方便,但是只是在用户的脑海中不存储公共terminal的login信息。

我认为在HTML 5中支持autocomplete=off

问问你自己为什么要这样做 – 在某些情况下可能有意义,但不要仅仅为了这样做。

用户不太方便,甚至没有OS X的安全问题(下面的Soren提到)。 如果您担心远程窃取用户的密码 – 即使您的应用使用了autcomplete=off按键logging器仍然可以执行此操作。

作为一个select浏览器的用户记得(大部分)我的信息,如果你的网站不记得我的话,我会觉得很烦人。

是一个没有标准的方式做到这一点(我认为Mozilla和IE仍然支持),但与用户的期望混乱通常是一个坏主意。

如果用户将他们的信用卡信息input到表单中,然后让其他人使用该浏览器,则不是您的担心:)

在这次谈话中没有任何解决scheme为我工作。

我终于想出了一个纯粹的HTML解决scheme ,它不需要Javascript ,可以在现代浏览器中工作(IE除外;至less有1个catch,对吧?),并且不需要为整个表单禁用自动完成function。

只需closuresform上的自动填充function,然后将其打开,以便在form对其进行任何input 。 例如:

 <form autocomplete="off"> <!-- these inputs will not allow autocomplete and chrome won't highlight them yellow! --> <input name="username" /> <input name="password" type="password" /> <!-- this field will allow autocomplete to work even though we've disabled it on the form --> <input name="another_field" autocomplete="on" /> </form> 

添加

autocomplete="off"

到窗体标签将禁用浏览器自动完成(以前input到该字段)从该特定窗体中的所有input字段。

testing:

  • Firefox 3.5,4 BETA
  • Internet Explorer 8

为了避免无效的XHTML,你可以使用javascript来设置这个属性。 使用jQuery的示例:

 <input type="text" class="noAutoComplete" ... /> $(function() { $('.noAutoComplete').attr('autocomplete', 'off'); }); 

问题是,没有JavaScript的用户将获得自动完成function。

为字段使用非标准的名称和ID,所以而不是“名称”有“name_”。 浏览器将不会将其视为名称字段。 最好的部分是你可以做到这一点,但不是所有的领域,它会自动完成一些,但不是所有的领域。

如果只是autocomplete="off"不起作用,请尝试这些:

 autocorrect="off" autocapitalize="off" autocomplete="off" 

添加autocomplete="off"不会削减它。

将inputtypes属性更改为type="search"
Google不会将自动填充应用于具有searchtypes的input。

这是浏览器现在忽略的一个安全问题。 浏览器使用input名称标识和存储内容,即使开发人员认为信息是敏感的,也不应该存储。 在两个请求之间创build一个不同的input名称将会解决问题(但仍然会保存在浏览器的caching中,并且还会增加浏览器的caching)。 要求用户在其浏览器设置中激活或停用选项不是一个好的解决scheme。 这个问题可以在后台修复。

这是我的修复。 我在框架中实施的一种方法。 所有的自动完成元素都是用这样的隐藏input生成的:

 <? $r = rmd5(rand().mocrotime(TRUE)); ?> <form method="POST" action="./"> <input type="text" name="<? echo $r; ?>" /> <input type="hidden" name="__autocomplete_fix_<? echo $r; ?>" value="username" /> <input type="submit" name="submit" value="submit" /> </form> 

服务器然后像这样处理postvariables:

 foreach ($_POST as $key => $val) { if(preg_match('#^__autocomplete_fix_#', $key) === 1){ $n = substr($key, 19); if(isset($_POST[$n]))$_POST[$val] = $_POST[$n]; } } 

该值可以像往常一样访问

 var_dump($_POST['username']); 

而浏览器将无法build议以前的请求或以前的用户的信息。

所有的作品就像一个魅力,即使浏览器更新,也想忽略自动完成。 这是解决这个问题的最好方法。

我不敢相信,在报道之后这个问题仍然存在。 上面的解决scheme对我来说并不适用,因为Safari浏览器似乎知道元素何时不显示或不在屏幕上,但是下面这些对我来说是有用的:

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

希望对某个人有用!

在这里提到的黑客都没有在Chrome中为我工作。 这里讨论了这个问题: https : //code.google.com/p/chromium/issues/detail?id=468153#c41

<form>添加这个工作(至less现在):

 <div style="display: none;"> <input type="text" id="PreventChromeAutocomplete" name="PreventChromeAutocomplete" autocomplete="address-level4" /> </div> 

有点迟到游戏…但我遇到了这个问题,并尝试了几个失败,但这一个适用于我在MDNfind

在某些情况下,即使autocomplete属性设置为off,浏览器也会一直提示自动填充值。 这种意外的行为对于开发者来说可能是相当困惑的 真正强制不完成的技巧是将随机string分配给属性,如下所示:

 autocomplete="nope" 

你可以在input中使用。

例如;

 <input type=text name="test" autocomplete="off" /> 

Chrome正在计划支持这一点 。

现在最好的build议是使用很less自动完成的inputtypes。

铬讨论

 <input type='search' name="whatever" /> 

要与Firefox兼容,请使用正常的自动完成=“closures”

 <input type='search' name="whatever" autocomplete='off' /> 

如果您删除form标记,则可以禁用自动完成function,银行也完成相同的function,但我不知道他们是如何做到的。 删除标签后,它甚至删除了浏览器已经记住的值。

您可以简单地把autocomplete="off"在HTML字段,如下面的代码。

 <input type="text" name="" value="" autocomplete="off" /> 

这为我工作。

 <input name="pass" type="password" autocomplete="new-password" />