禁用浏览器的“保存密码”function
为政府医疗机构工作的乐趣之一就是不得不处理所有关于PHI(受保护的健康信息)的偏执狂。 不要误解我的意思,我尽一切努力来保护人们的个人信息(健康,财务,上网习惯等),但是有时候人们会有点过于激动。
案例:我们最近的一位国有客户发现,浏览器提供了方便的function来保存您的密码。 我们都知道它已经存在了一段时间,完全是可选的,取决于最终用户决定是否明智决定是否使用。 然而,目前有一些哗然,我们正在被要求find一种方法来禁用我们网站的function。
问 :有没有办法让网站告诉浏览器不要提供记住密码? 我已经围绕Web开发了很长一段时间,但不知道我曾经遇到过。
任何帮助表示赞赏。
我不确定它是否可以在所有浏览器中使用,但是您应该尝试在表单上设置autocomplete =“off”。
<form id="loginForm" action="login.cgi" method="post" autocomplete="off">
禁用表单和密码存储提示并阻止表单数据在会话历史logging中caching的最简单方法是使用值为“off”的自动完成表单元素属性。
从http://developer.mozilla.org/En/How_to_Turn_Off_Form_Autocompletion
一些小的研究表明,这在IE浏览器工作,但我不会保证;)
@Joseph :如果这是一个严格的要求,通过XHTMLvalidation与实际的标记(不知道为什么会这样),但理论上可以添加此属性与JavaScript后,但随后js用户禁用(可能是一个可忽略的用户数量或者如果你的网站需要js则为零)仍然会保存它们的密码。
jQuery示例:
$('#loginForm').attr('autocomplete', 'off');
我一直在为这个问题苦苦挣扎,并带来了一个独特的问题。 特权用户不能让保存的密码为他们工作,但普通用户需要它。 这意味着特权用户必须login两次,第二次强制执行没有保存的密码。
有了这个要求,标准的autocomplete="off"
方法在所有的浏览器上都不起作用,因为密码可能已经从第一次login时被保存了。 一位同事find了一个解决scheme,用新的密码字段来replace密码字段,然后专注于新的密码字段(然后挂接相同的事件处理程序)。 这工作(除了在IE6导致无限循环)。 也许有一种解决方法,但是这导致了我的偏头痛。
最后,我试图在表单外面input用户名和密码。 令我惊讶的是,这工作! 它适用于IE6,以及Linux和Firefox上的当前版本。 我还没有进一步testing,但我怀疑它在大多数,如果不是所有的浏览器(但它不会让我感到惊讶,如果有一个浏览器不在乎,如果没有forms)。
下面是一些示例代码,以及一些jQuery来使其工作:
<input type="text" id="username" name="username"/> <input type="password" id="password" name="password"/> <form id="theForm" action="/your/login" method="post"> <input type="hidden" id="hiddenUsername" name="username"/> <input type="hidden" id="hiddenPassword" name="password"/> <input type="submit" value="Login"/> </form> <script type="text/javascript" language="JavaScript"> $("#theForm").submit(function() { $("#hiddenUsername").val($("#username").val()); $("#hiddenPassword").val($("#password").val()); }); $("#username,#password").keypress(function(e) { if (e.which == 13) { $("#theForm").submit(); } }); </script>
那么,这是一个非常古老的职位,但我仍然会给我的解决scheme,这是我的团队一直努力实现的。 我们只是在窗体中添加了一个新的inputtypes=“密码”字段,并将其封装在div中,并隐藏了div。 确保这个div在实际的密码input之前。 这对我们有效,它没有给出任何保存密码选项
Plunk – http://plnkr.co/edit/xmBR31NQMUgUhYHBiZSg?p=preview
HTML:
<form method="post" action="yoururl"> <div class="hidden"> <input type="password"/> </div> <input type="text" name="username" placeholder="username"/> <input type="password" name="password" placeholder="password"/> </form>
CSS:
.hidden {display:none;}
只需添加
readonly onfocus =“this.removeAttribute('readonly');”
除了
自动填充=“closures”
到您不想记住表单数据( username
, password
等)的input如下所示:
<input type="text" name="UserName" autocomplete="off" readonly onfocus="this.removeAttribute('readonly');" > <input type="password" name="Password" autocomplete="off" readonly onfocus="this.removeAttribute('readonly');" >
testing主stream浏览器的最新版本,如Google Chrome
, Mozilla Firefox
, Microsoft Edge
等,像一个魅力工作。 希望这可以帮助…
您可以通过随机化每个节目中用于密码字段的名称来阻止浏览器匹配表单。 然后浏览器看到相同的URL的密码,但不能确定它是相同的密码 。 也许它正在控制别的东西。
更新:请注意,这应该是除了使用自动完成或其他策略,而不是替代他们,由于其他人指出的原因。
另外请注意,这只会阻止浏览器自动完成密码。 它不会阻止它以任何级别的浏览器select使用的安全性来存储密码。
使用真正的双因素身份validation来避免唯一依赖密码,这些密码可能存储在比用户的浏览器caching更多的地方。
我已经testing过在所有主stream浏览器的表单标签中添加autocomplete =“off”。 事实上,美国大多数人使用IE8至今。
- IE8,IE9,IE10,Firefox,Safari都正常。
浏览器不要求“保存密码”。 此外,以前保存的用户名和密码没有填充。
- Chrome和IE 11不支持自动完成=“closures”function
- FF支持自动完成=“closures”。 但是有时候现有的保存的证书被填充。
2014年6月11日更新
最后,下面是一个使用javascript的跨浏览器解决scheme,它在所有的浏览器中工作正常。
需要删除login表单中的“表单”标签。 在客户端validation之后,将该凭证以隐藏的forms提交。
另外,添加两个方法。 一个用于validation“validateLogin()”,另一个用于监听input事件,同时点击input文本框/密码/button“checkAndSubmit()”。 因为现在login表单没有表单标签,所以input事件不在这里工作。
HTML
<form id="HiddenLoginForm" action="" method="post"> <input type="hidden" name="username" id="hidden_username" /> <input type="hidden" name="password" id="hidden_password" /> </form> Username: <input type="text" name="username" id="username" onKeyPress="return checkAndSubmit(event);" /> Password: <input type="text" name="password" id="password" onKeyPress="return checkAndSubmit(event);" /> <input type="button" value="submit" onClick="return validateAndLogin();" onKeyPress="return checkAndSubmit(event);" />
使用Javascript
//For validation- you can modify as you like function validateAndLogin(){ var username = document.getElementById("username"); var password = document.getElementById("password"); if(username && username.value == ''){ alert("Please enter username!"); return false; } if(password && password.value == ''){ alert("Please enter password!"); return false; } document.getElementById("hidden_username").value = username.value; document.getElementById("hidden_password").value = password.value; document.getElementById("HiddenLoginForm").submit(); } //For enter event function checkAndSubmit(e) { if (e.keyCode == 13) { validateAndLogin(); } }
祝你好运!!!
最简洁的方法是使用autocomplete="off"
标签属性,但是当你用Tab切换字段时,Firefox不能正确地遵守它。
唯一可以阻止的方法是添加一个假的隐藏的密码字段,它会欺骗浏览器在那里填充密码。
<input type="text" id="username" name="username"/> <input type="password" id="prevent_autofill" autocomplete="off" style="display:none" tabindex="-1" /> <input type="password" id="password" autocomplete="off" name="password"/>
这是一个丑陋的黑客,因为你改变浏览器的行为,这应该被认为是不好的做法。 只有当你真的需要它时才使用它。
注意:这将有效地阻止密码自动填充,因为FF会“保存” #prevent_autofill
(这是空的)的值,并将尝试填充所有保存的密码,因为它总是使用它发现的第一个type="password"
inputDOM之后分别input“用户名”。
不是真的 – 你唯一能做的就是在网站上提供build议。 也许,在他们第一次login之前,你可以向他们展示一个表单,表明不build议他们允许浏览器存储密码。
然后,用户将立即按照build议,在便条上记下密码,并将其粘贴到监视器上。
我一直在做的是自动完成=“closures”和清除使用JavaScript / jQuery的密码字段的组合。
jQuery示例:
$(function() { $('#PasswordEdit').attr("autocomplete", "off"); setTimeout('$("#PasswordEdit").val("");', 50); });
通过使用setTimeout()
您可以在清除之前等待浏览器完成该字段,否则在清除该字段后,浏览器将始终自动完成。
如果自动完成=“关”不工作…删除表单标签,并使用div标签,然后将表单值传递到服务器。 这对我有效。
只是让人们意识到 – “自动完成”属性大多数时间工作,但高级用户可以使用书签小工具来解决它。
有一个浏览器保存你的密码实际上增加了对键盘logging的保护,所以可能最安全的select是在浏览器中保存密码,但用主密码(至less在Firefox中)保护它们。
因为自动完成=“closures”不适用于密码字段,所以必须依靠javascript。 这里有一个基于在这里find答案的简单解决scheme。
将属性data-password-autocomplete =“off”添加到您的密码字段中:
<input type="password" data-password-autocomplete="off">
包括以下JS:
$(function(){ $('[data-password-autocomplete="off"]').each(function() { $(this).prop('type', 'text'); $('<input type="password"/>').hide().insertBefore(this); $(this).focus(function() { $(this).prop('type', 'password'); }); }); });
该解决scheme适用于Chrome和FF。
马库斯提出了一个伟大的观点。 我决定查找autocomplete
属性,并得到以下内容:
使用这个属性唯一的缺点是它不是标准的(它在IE和Mozilla浏览器中可用),并且会导致XHTMLvalidation失败。 我认为这是一个合理的情况下打破validation。 ( 来源 )
所以我不得不说,虽然它不能100%全面工作,但在主stream浏览器中处理,所以它是一个很好的解决scheme。
我有一个工作,这可能会有所帮助。
你可以做一个自定义的字体破解。 所以,制作一个自定义的字体,例如所有的字符都是点/圆/星形。 将其用作您的网站的自定义字体。 检查如何在inkscape中做到这一点: 如何制作自己的字体
然后在你的login表单中使用:
<form autocomplete='off' ...> <input type="text" name="email" ...> <input type="text" name="password" class="password" autocomplete='off' ...> <input type=submit> </form>
然后添加你的CSS:
@font-face { font-family: 'myCustomfont'; src: url('myCustomfont.eot'); src: url('myCustomfont?#iefix') format('embedded-opentype'), url('myCustomfont.woff') format('woff'), url('myCustomfont.ttf') format('truetype'), url('myCustomfont.svg#myCustomfont') format('svg'); font-weight: normal; font-style: normal; } .password { font-family:'myCustomfont'; }
漂亮的跨浏览器兼容。 我已经尝试过IE6 +,FF,Safari和Chrome。 只要确保你转换的字体不会被破坏。 希望它有帮助吗?
解决这个问题的最简单方法是将INPUT字段放在FORM标签之外,并在FORM标签中添加两个隐藏的字段。 然后在提交事件监听器之前,表单数据被提交给从可见input到不可见input的服务器拷贝值。
下面是一个例子(你不能在这里运行它,因为表单操作没有设置为真实的login脚本):
<!doctype html> <html> <head> <title>Login & Save password test</title> <meta charset="utf-8"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> </head> <body> <!-- the following fields will show on page, but are not part of the form --> <input class="username" type="text" placeholder="Username" /> <input class="password" type="password" placeholder="Password" /> <form id="loginForm" action="login.aspx" method="post"> <!-- thw following two fields are part of the form, but are not visible --> <input name="username" id="username" type="hidden" /> <input name="password" id="password" type="hidden" /> <!-- standard submit button --> <button type="submit">Login</button> </form> <script> // attache a event listener which will get called just before the form data is sent to server $('form').submit(function(ev) { console.log('xxx'); // read the value from the visible INPUT and save it to invisible one // ... so that it gets sent to the server $('#username').val($('.username').val()); $('#password').val($('.password').val()); }); </script> </body> </html>
我的js(jquery)解决方法是将表单提交中的密码inputtypes更改为文本 。 密码可以变得可见一秒钟,所以我也隐藏input之前。 我宁愿不使用这个login表单 ,但它是有用的(连同自动完成=“closures”),例如在网站的pipe理部分。
尝试把它放在一个控制台(使用jQuery),然后再提交表单。
$('form').submit(function(event) { $(this).find('input[type=password]').css('visibility', 'hidden').attr('type', 'text'); });
在Chrome 44.0.2403.157(64位)上进行testing。
我尝试以上autocomplete="off"
,但任何成功。 如果您使用angular度js我的build议是去与button和ng点击。
<button type="button" class="" ng-click="vm.login()" />
这已经有了一个可以接受的答案,如果有人不能用他接受的答案来解决问题,他可以用我的机制去解决问题。
感谢您的问题和答案。
我testing了很多解决scheme。 dynamic密码字段名称,多个密码字段(假的不可见),inputtypes从“文本”更改为“密码”,自动完成=“closures”,自动完成=“新密码”,…但没有解决它与最近浏览器。
为了摆脱密码记住,我最后把密码当作input字段,并且“模糊”input的文本。
由于select键入的文本将显示为明文,但不记住密码,所以它比原生密码字段更“安全”。 这也取决于有Javascript激活。
您将估计使用下面的build议与密码记住从导航器选项的风险。
虽然密码记住可以由用户pipe理(每个站点disbaled),但个人电脑,而不是“公共”或共享计算机的罚款。
我的情况是在共享计算机上运行一个ERP,所以我会尝试下面的解决scheme。
<input style="background-color: rgb(239, 179, 196); color: black; text-shadow: none;" name="password" size="10" maxlength="30" onfocus="this.value='';this.style.color='black'; this.style.textShadow='none';" onkeypress="this.style.color='transparent'; this.style.textShadow='1px 1px 6px green';" autocomplete="off" type="text">
我知道的一种方法是在提交表单之前使用(例如)JavaScript将密码字段中的值复制出来。
这个问题的主要问题是该解决scheme绑定到JavaScript。
然后,如果可以绑定到JavaScript,那么在向服务器发送请求之前,也可以在客户端散列密码。
真正的问题比仅仅为HTML添加属性要深得多 – 这是常见的安全问题,这就是为什么人们为了安全而发明了硬件密钥和其他疯狂的东西。
想象一下,你有自动完成=“closures”在所有浏览器完美的工作。 这将有助于安全吗? 当然不。 用户将在教科书中写下他们的密码,在他们的显示器上粘贴标签,每个办公室的访问者都可以看到他们,将他们保存到桌面上的文本文件等等。
通常,Web应用程序和Web开发人员对于最终用户安全不负任何责任。 最终用户只能保护自己。 理想情况下,他们必须保持所有的密码,并使用密码重置function(或联系pipe理员),以防万一他们忘记了。 否则总是会有一个风险,即密码可以被看到并被偷走。
所以要么有一些疯狂的硬件安全策略(比如一些银行提供基本采用双因素身份validation的网上银行)或者基本上没有安全防护。 那么,这当然有点夸张了。 了解你想要保护什么是很重要的:
- 未经授权的访问。 最简单的login表单基本上是足够的。 有时会采取其他措施,如随机安全问题,CAPTCHA,密码强化等。
- 凭据嗅探。 如果用户从公共Wi-Fi热点访问您的Web应用程序,则必须使用HTTPS。请注意,即使使用HTTPS,用户也需要定期更改密码。
- 内幕攻击 有很多这样的例子,从简单地从浏览器中窃取你的密码或者你在桌面某处写下的那些(不需要任何IT技能),并以会话伪造和拦截本地networking通信(甚至被encryption)结束,并进一步访问Web应用程序就像是另一个最终用户。
在这个特定的职位上,我可以看到对开发人员的要求不够,因为问题的本质 – 最终用户安全,他永远无法解决这个问题。 我的主观观点是,开发者应该基本上说NO,并且指出需求问题,而不是浪费时间在这些任务上。 这并不能使你的系统更加安全,反而会导致在显示器上贴上标签的情况。 不幸的是,一些老板只听到他们想听到的东西。 但是,如果我是你,我会试着解释实际问题的来源,而自动完成=“closures”不会解决它,除非它会强制用户把所有的密码保存在他们的头上! 开发者不能完全保护用户,用户需要知道如何使用系统,同时不要暴露他们的敏感/安全信息,这远远超出了authentication。
面对同样的HIPAA问题,find了一个相对容易的解决scheme,
-
使用字段名称创build一个隐藏的密码字段作为数组。
<input type="password" name="password[]" style="display:none" />
-
使用相同的数组作为实际密码字段。
<input type="password" name="password[]" />
浏览器(Chrome)可能会提示您“保存密码”,但无论用户select保存,下次login密码时都会自动填充隐藏密码字段,即arrays中的零插槽,将第一个插槽留空。
我尝试定义数组,例如“password [part2]”,但它仍然记得。 如果它是一个无索引的数组,那么我认为它会抛弃它,因为它别无select,只能放在第一个位置。
然后你使用你select的编程语言来访问数组,例如PHP,
echo $_POST['password'][1];
有没有办法让网站告诉浏览器不要提供记住密码?
该网站通过使用<input type="password">
告诉浏览器它是一个密码。 所以如果你必须从网站的angular度来做到这一点,那么你将不得不改变这一点。 (显然我不推荐这个)。
最好的解决办法是让用户configuration他们的浏览器,这样就不会记住密码。
If you do not want to trust the autocomplete flag, you can make sure that the user types in the box using the onchange event. The code below is a simple HTML form. The hidden form element password_edited starts out set to 0. When the value of password is changed, the JavaScript at the top (pw_edited function) changes the value to 1. When the button is pressed, it checks the valueenter code here before submitting the form. That way, even if the browser ignores you and autocompletes the field, the user cannot pass the login page without typing in the password field. Also, make sure to blank the password field when focus is set. Otherwise, you can add a character at the end, then go back and remove it to trick the system. I recommend adding the autocomplete="off" to password in addition, but this example shows how the backup code works.
<html> <head> <script> function pw_edited() { document.this_form.password_edited.value = 1; } function pw_blank() { document.this_form.password.value = ""; } function submitf() { if(document.this_form.password_edited.value < 1) { alert("Please Enter Your Password!"); } else { document.this_form.submit(); } } </script> </head> <body> <form name="this_form" method="post" action="../../cgi-bin/yourscript.cgi?login"> <div style="padding-left:25px;"> <p> <label>User:</label> <input name="user_name" type="text" class="input" value="" size="30" maxlength="60"> </p> <p> <label>Password:</label> <input name="password" type="password" class="input" size="20" value="" maxlength="50" onfocus="pw_blank();" onchange="pw_edited();"> </p> <p> <span id="error_msg"></span> </p> <p> <input type="hidden" name="password_edited" value="0"> <input name="submitform" type="button" class="button" value="Login" onclick="return submitf();"> </p> </div> </form> </body> </html>
autocomplete="off" does not work for disabling the password manager in Firefox 31 and most likely not in some earlier versions, too.
Checkout the discussion at mozilla about this issue: https://bugzilla.mozilla.org/show_bug.cgi?id=956906
We wanted to use a second password field to enter a one-time password generated by a token. Now we are using a text input instead of a password input. 🙁
I was given a similar task to disable the auto-filling up of login name and passwords by browser, after lot of trial and errors i found the below solution to be optimal. Just add the below controls before your original controls.
<input type="text" style="display:none"> <input type="text" name="OriginalLoginTextBox"> <input type="password" style="display:none"> <input type="text" name="OriginalPasswordTextBox">
This is working fine for IE11 and Chrome 44.0.2403.107
autocomplete="off" works for most modern browsers, but another method I used that worked successfully with Epiphany (a WebKit-powered browser for GNOME) is to store a randomly generated prefix in session state (or a hidden field, I happened to have a suitable variable in session state already), and use this to alter the name of the fields. Epiphany still wants to save the password, but when going back to the form it won't populate the fields.
I haven't had any issues using this method:
Use autocomplete="off", add a hidden password field and then another non-hidden one. The browser tries to auto complete the hidden one if it doesn't respect autocomplete="off"
Another solution is to make the POST using an hidden form where all the input are of type hidden. The visible form will use input of type "password". The latter form will never be submitted and so the browser can't intercept at all the operation of login.
Since Internet Explorer 11 no longer supports autocomplete="off"
for input type="password"
fields (hopefully no other browsers will follow their lead), the cleanest approach (at the time of writing) seems to be making users submit their username and password in different pages, ie the user enters their username, submit, then enters their password and submit. The Bank Of America and HSBC Bank websites are using this, too.
Because the browser is unable to associate the password with a username, it will not offer to store passwords. This approach works in all major browsers (at the time of writing) and will function properly without the use of Javascript. The downsides are that it would be more troublesome for the user, and would take 2 postbacks for a login action instead of one, so it really depends on how secure your website needs to be.
Update: As mentioned in this comment by Gregory , Firefox will be following IE11's lead and ignore autocomplete="off"
for password fields.