How do you disable browser Autocomplete on web form field / input tag?
对于特定的
30
- The password manager always prompts if it wants to save a password. Passwords are not saved without permission from the user.
- We are the third browser to implement this change, after IE and Chrome.
根据Mozilla开发者使用的表单元素的属性
1 | <input type="text" name="foo" autocomplete="off" /> |
在两个
当submitted形状的冰淇淋,你可以带我方处理断之前,他们在服务器端。这是我的目标是从Web浏览器的测距范围为你的鸭场也可能帮助预防xsrf攻击,因为安attacker不会能够代表我想一场名为"形式提交。
大多数主要浏览器和密码管理器(正确地说,imho)现在都忽略了
为什么?许多银行和其他"高安全性"网站为了安全目的在登录页面添加了
很久以前,大多数密码管理器开始忽略
不幸的是,自动完成实现中的错误将用户名和/或密码信息插入不适当的表单字段中,从而导致表单验证错误,或者更糟的是,意外地将用户名插入到用户故意留空的字段中。
Web开发人员要做什么?
- 如果您可以将所有密码字段单独保存在一个页面上,这是一个很好的开始,因为似乎密码字段的存在是用户/密码自动完成启动的主要触发器。否则,请阅读下面的提示。
- Safari注意到有两个密码字段,并在这种情况下禁用自动完成功能,假定它必须是更改密码表单,而不是登录表单。因此,只要确保在允许的任何表单中使用2个密码字段(新建和确认新建)。
不幸的是,Chrome34每次看到密码字段时,都会尝试用user/pass自动填充字段。这是一个非常糟糕的错误,希望他们能改变狩猎行为。但是,将此项添加到表单顶部似乎会禁用密码自动填充:
1
2<input type="text" style="display:none">
<input type="password" style="display:none">
我还没有彻底调查过IE或火狐,但如果其他人在评论中有信息,我会很乐意更新答案。
有时,即使autocomplete=off也不会阻止将凭证填充到错误的字段中,但不会阻止用户或昵称字段。
这个解决方法是对Apinstein关于浏览器行为的文章的补充。
以只读方式修复浏览器自动填充,并将焦点设置为可写(单击并选项卡)
1 2 | <input type="password" readonly onfocus="this.removeAttribute('readonly');"/> |
更新:MobileSafari在字段中设置光标,但不显示虚拟键盘。新的修复程序和以前一样工作,但处理虚拟键盘:
1 2 3 4 | <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/
//UpDead Enter
因为浏览器自动将凭证填充到错误的文本字段中!?
我注意到Chrome和Safari上的这种奇怪行为,因为在同一表单中有密码字段。我想,浏览器会寻找一个密码字段来插入您保存的凭证。然后,它自动填充(只是由于观察而猜测)最近的类似文本的输入字段,该字段出现在dom中密码字段之前。因为浏览器是最后一个实例,您不能控制它,
上面这个只读修复程序对我有效。
1 2 | <form name="form1" id="form1" method="post" autocomplete="off" action="http://www.example.com/form.cgi"> |
这将工作在IE和Mozilla的Firefox,它下方的冰,冰槽的XHTML标准。
chrome的解决方案是将
例子:
1 2 3 4 5 | <form name="myForm"" method="post"> <input name="user" type="text" /> <input name="pass" type="password" autocomplete="new-password" /> <input type="submit"> </form> |
如果Chrome找到一个密码框,它总是自动完成数据,刚好足以指示该框的
This works well for me.
注意:使用F12确保更改生效,浏览器多次将页面保存在缓存中,这给了我一个坏印象,认为它不起作用,但浏览器实际上没有带来更改。
"有人说,答案
然而,我认为它的价值说明为什么它的一个很好的想法,这两个使用在某些用例作为一些回答两个问题需要复制,这与它的suggested最好不要打开它关闭。
信用卡堵browsers储存数不应该是左两个用户。太多的用户甚至不会意识到这是一个问题。
它的特别重要的把它断开田信用卡安全码。本页为美国:
"Never store the security code ... its value depends on the presumption that the only way to supply it is to read it from the physical credit card, proving that the person supplying it actually holds the card."
冰的问题,如果它的一个公共计算机(网络咖啡馆,图书馆等),它的那么容易为其他用户窃取你的两个卡和细节,甚至在你自己的机器一个恶意网站窃取的数据可以自动完成。
为了避免禁用自动完成,我不得不和那些答案不同。
首先要提到的是,在登录表单字段上未显式禁用自动完成是PCI-DSS失败。此外,如果用户的本地计算机受到破坏,则攻击者可以通过将任何自动完成数据存储在clear中的方式获取这些数据。
当然有一个关于可用性的争论,但是当涉及到哪些表单字段应该禁用自动完成功能,哪些不应该禁用时,有一个非常好的平衡。
三种选择:第一:
1 | <input type='text' autocomplete='off' /> |
第二:
1 | <form action='' autocomplete='off'> |
第三个(javascript代码):
1 | $('input').attr('autocomplete', 'off'); |
我已经通过使用随机字符解决了与谷歌Chrome的无休止的斗争。当您总是用随机字符串呈现自动完成时,它将永远不会记住任何内容。
1 | <input name="name" type="text" autocomplete="rutjfkde"> |
希望对别人有帮助。
在一个相关。事实上,在对面的完全记录
"If you're the user of the aforementioned form and want to re-enable
the autocomplete functionality, use the 'remember password'
bookmarklet from this bookmarklets
page. It removes
allautocomplete="off" attributes from all forms on the page. Keep
fighting the good fight!"
我看到
事实上我们做得使用sasB的一点想法。这是一个Web应用程序的两个医学软件运行一个医生的办公室。然而,我们的客户多是世界卫生组织的外科用很多不同的workstations,包括半公共的终端。所以,他们想确保这是一个医生不理解《大学implication自动保存了密码或不支付注意不能让他们意外的登录信息很容易访问。当然,这是之前的想法(这是私人浏览功能的启动是在IE8,ff3.1等。即使如此,许多医生都被迫使用旧的学校在医院的browsers用它,不会改变。
所以,我们只是"Generate登录页的随机场的名字,这是我唯一的工作岗位。是的,它的convenient较少,但这只是hitting头,在《关于用户的登录信息储存槽对公共终端。
我一直在尝试无限的解决方案,然后我发现:
代替
就这么简单,它在谷歌Chrome中也很有魅力!
在这次谈话中,没有一个解决方案对我有用。
我最终找到了一个不需要JavaScript的纯HTML解决方案,它可以在现代浏览器中工作(除了IE;必须至少有一个catch,对吗?),并且不要求您禁用整个表单的自动完成功能。
只需关闭
1 2 3 4 5 6 7 8 9 | <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> |
我认为HTML5支持
问问你自己为什么要这样做-在某些情况下这可能是有意义的,但不要仅仅为了这样做。
它对用户来说不太方便,在OSX中甚至不存在安全问题(下面由Soren提到)。如果你担心人们的密码被远程窃取——即使你的应用程序使用
作为一个选择让浏览器记住(大部分)我的信息的用户,如果你的网站不记得我的信息,我会觉得很烦人。
我是一个非标准的方式这样做(我认为火狐和IE还支持它),但铜与用户期望的是一个理想的要求。
如果用户enters他们的信用卡资料,然后在一种轻松的别人你使用的浏览器,这不是你的问题。:)
这对我有用。
1 | <input name="pass" type="password" autocomplete="new-password" /> |
我们也可以在文本、选择等其他控件中使用此策略。
最佳解决方案:
阻止自动完成用户名(或电子邮件)和密码:
1 2 | <input type="email" name="email"><!-- Can be type="text" --> <input type="password" name="password" autocomplete="new-password"> |
阻止自动完成字段:
1 | <input type="text" name="field" autocomplete="nope"> |
说明:
作品:
铬:49、50、51、52、53、54、55、56、57、58、59、60、61、62、63和64
火狐:44、45、46、47、48、49、50、51、52、53、54、55、56、57和58
尝试添加
readonly onfocus="this.removeAttribute('readonly');"
除了
autocomplete="off"
对于您不想记住表单数据的输入(
1 2 3 4 5 | <input type="text" name="UserName" autocomplete="off" readonly onfocus="this.removeAttribute('readonly');"> <input type="password" name="Password" autocomplete="off" readonly onfocus="this.removeAttribute('readonly');"> |
< BR>更新:下面是基于这种方法的完整示例,它可以防止拖放、复制、粘贴等操作。
1 2 3 4 5 6 7 8 | <input type="text" name="UserName" style="text-transform:lowercase;" placeholder="Username" autocomplete="off" readonly onfocus="this.removeAttribute('readonly');" oncopy="return false" ondrag="return false" ondrop="return false" onpaste="return false" oncontextmenu="return false"> <input type="password" name="Password" placeholder="Password" autocomplete="off" readonly onfocus="this.removeAttribute('readonly');" oncopy="return false" ondrag="return false" ondrop="return false" onpaste="return false" oncontextmenu="return false"> |
测试主要浏览器的最新版本,如
比赛有点晚了……但是我遇到了这个问题,尝试了几次失败,但是这个在MDN上对我有用
In some case, the browser will keep suggesting autocompletion values
even if the autocomplete attribute is set to off. This unexpected
behavior can be quite puzzling for developers. The trick to really
force the no-completion is to assign a random string to the attribute
like so :
1 | autocomplete="nope" |
添加
到表单标记将禁用该特定表单中所有
测试:
- 火狐3.5,4测试版
- Internet Explorer 8
- 铬
为了避免无效的XHTML,可以使用javascript设置此属性。使用jquery的示例:
1 2 3 4 5 | <input type="text" class="noAutoComplete" ... /> $(function() { $('.noAutoComplete').attr('autocomplete', 'off'); }); |
问题是没有javascript的用户将获得自动完成功能。
使用一个非标准的名称和ID字段,所以"name"而不是"_ name"。browsers则不会看到它的名称为"场"。最好的冰淇淋的人吗?你可以做这样一些但不是所有的字段,它将自动完成一些但不是所有的领域。
添加
将输入类型属性更改为
我不敢相信这在报道这么久之后仍然是个问题。上述解决方案对我不起作用,因为Safari似乎知道元素何时没有显示或屏幕外,但是以下解决方案对我起作用:
1 2 | Username <input type="text" name="fake_safari_username"> Password <input type="password" name="fake_safari_password"> |
希望对某人有用!
这是浏览器现在忽略的安全问题。浏览器使用输入名称识别和存储内容,即使开发人员认为信息是敏感的,不应该存储。在两个请求之间使用不同的输入名称可以解决此问题(但仍将保存在浏览器的缓存中,并且还会增加浏览器的缓存)。要求用户激活或停用浏览器设置中的选项不是一个好的解决方案。可以在后端修复此问题。
这是我的修理。我在框架中实现的方法。所有自动完成元素都是使用如下隐藏输入生成的:
1 2 3 4 5 6 | <? $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> |
然后服务器处理post变量,如下所示:
1 2 3 4 5 6 7 | foreach ($_POST as $key => $val) { if(preg_match('#^__autocomplete_fix_#', $key) === 1){ $n = substr($key, 19); if(isset($_POST[$n]))$_POST[$val] = $_POST[$n]; } } |
该值可以像往常一样访问
1 | var_dump($_POST['username']); |
浏览器将无法从以前的请求或以前的用户那里建议信息。
所有这些都像一个魅力,即使浏览器更新,想要忽略自动完成或不。这是解决这个问题的最好方法。
如果只是
1 | autocorrect="off" autocapitalize="off" autocomplete="off" |
所以这里是:
1 2 3 | function turnOnPasswordStyle() { $('#inputpassword').attr('type',"password"); } |
1 | <input oninput="turnOnPasswordStyle()" id="inputpassword" type="text"> |
这里提到的黑客没有一个对我有用。这里有一个关于这个问题的讨论:https://code.google.com/p/chromium/issue s/detail?ID=468153×C41
在