我需要能够防止用户登录后甚至出现“保存密码”气泡。
自动完成=关闭不是答案。
我没有遇到过为这个问题提供安全解决方案的帖子。 是否真的无法在Chrome中禁用密码气泡?
我需要能够防止用户登录后甚至出现“保存密码”气泡。
自动完成=关闭不是答案。
我没有遇到过为这个问题提供安全解决方案的帖子。 是否真的无法在Chrome中禁用密码气泡?
我发现没有“支持”的方式来做到这一点。
我所做的是将密码内容复制到隐藏字段,并在提交之前删除密码输入。
由于提交时页面上没有任何密码字段,因此浏览器永远不会要求保存。
这是我的javascript代码(使用jquery):
function executeAdjustment(){
$("#vPassword").val($("#txtPassword").val());
$(":password").remove();
var myForm = document.getElementById("createServerForm");
myForm.action = "executeCreditAdjustment.do";
myForm.submit();
}
经过几个小时的搜索,我想出了自己的解决方案,这似乎适用于Chrome和Safari(虽然不是在Firefox或Opera中,我还没有测试过IE) 。 诀窍是用两个虚拟字段包围密码字段。
<input type="password" class="stealthy" tabindex="-1">
<input type="password" name="password" autocomplete="off">
<input type="password" class="stealthy" tabindex="-1">
这是我使用的CSS:
.stealthy {
left: 0;
margin: 0;
max-height: 1px;
max-width: 1px;
opacity: 0;
outline: none;
overflow: hidden;
pointer-events: none;
position: absolute;
top: 0;
z-index: -1;
}
注意:虚拟输入字段不能再使用display: none
隐藏,因为浏览器检测到并忽略隐藏字段,即使字段本身未隐藏但隐藏在隐藏包装中。 因此,CSS类的原因基本上使得输入字段不可见且不可忽略而不“隐藏”它们。
将<input type="password" style="display:none"/>
到表单顶部。 Chrome的自动填充功能会填写它找到的第一个密码输入,以及之前的输入,因此只需填写一个无关紧要的输入即可。
最好的解决方案是使用输入文本模拟输入密码,方法是用星号或点替换值。
<input type="textbox" id="UserID" />
<input type="password" style="display:none"/>
<input type="textbox" id="password" />
<script>
function init() {
$('#password').replaceWith('<input type="password" id="password" />');
}
</script>
在Firefox和Chrome中测试按预期工作。
我找不到具备我需要的所有好处的替代品,创造了一个新的。
HTML
<input type="text" name="password" class="js-text-to-password-onedit">
jQuery(如果你不使用jQuery,用相同的逻辑替换为vanilla JS)
$('.js-text-to-password-onedit').focus(function(){
el = $(this);
el.keydown(function(e){
if(el.prop('type')=='text'){
el.prop('type', 'password');
}
});
// This should prevent saving prompt, but it already doesn't happen. Uncomment if nescessary.
//$(el[0].form).submit(function(){
// el.prop('readonly', true);
//});
});
优点:
我用以下标记处理了这个问题。
#txtPassword { -webkit-text-security: disc; }
<form autocomplete="off"> <input type="text" name="id" autocomplete="off"/> <input type="password" id="prevent_autofill" autocomplete="off" style="display:none" tabindex="-1" /> <input type="password" name="password" id="txtPassword" autocomplete="off"/> <button type="submit" class="login100-form-btn">Login</button> </form>
首先,我想告诉你一些事情。 当你[input type="text"]
和[input type="password"]
主流浏览器会为你提供弹出窗口。
现在,将[input type="password"]
替换为[input type="text"]
然后有css
#yourPassTextBoxId{
-webkit-text-secutiry:disc
}
我通过使用2个常规文本框来颠覆这一点。 一个包含实际密码,一个用作掩码。 然后,我将密码框的不透明度设置为0,并禁用蒙版文本框 - 但背景颜色设置为白色,使其显示为启用状态。 然后我将密码框放在掩码框的顶部。 在jscript函数中,我更新了掩码的文本值,以便在密码框中显示每个按键的'*'字符串。 两个缺点:根据您的浏览器,现在可能会显示闪烁的光标。 它显示在IE中,但不是Chrome或Firefox。 用户输入时有一点延迟。
我的代码片段在asp中:
$(window).ready(function() { var pw = $('#txtPassword'); var mask = $('#txtMask'); $(pw).css('opacity', '0'); $(pw).keyup(function() { var s = ''; for (var i = 0; i < $(pw).val().length; i++) s = s + '*'; mask.val(s); }) });
style... .password { font-family: monospace; position: absolute; background-color: white; }
Asp.net code: <asp:TextBox runat="server" CssClass="password" Width="300" ID="txtMask" ClientIDMode="Static" MaxLength="30" Enabled="false" /> <asp:TextBox runat="server" CssClass="password" Width="300" ID="txtPassword" ClientIDMode="Static" MaxLength="30" />
我有两个问题,当浏览器在常规页面中的支持登录页面上工作时,浏览器如何强制他们的密码行为(永远不应保存支持登录):
所以我结合了我在各种stackoverflow帖子上找到的两个解决方案,并认为我会在这里发布它们。 我正在使用jQuery,但原则也可以转换为常规JavaScript。
首先,让您的密码字段作为文本字段开始,并让JavaScript稍后更改 - 这提供了一个很好的机会,浏览器将不提供保存的密码。
其次,在提交表单之前,将密码表单设置回文本字段,但先将其隐藏,以便无法看到密码。 当密码字段消失时,可以通过添加另一个文本字段使其看起来更漂亮,但这只是装饰性的。
<form id="techForm" action="...">
<input type="text" id="username" name="username">
<input type="text" id="password" name="password"> <!-- this needs to start as a text field -->
<input type="submit" name="submit" value="submit">
</form>
<script type="text/javascript">
$(function()
{
$('#password').on('focus', function()
{
$(this).prop('type', password'); // this stops pre-saved password offers
});
$('#techForm').on('submit', function()
{
$('#password').hide().prop('type', 'text'); // this prevents saving
});
});
</script>
截至9/12/2017,这对我和Firefox和Chrome都有用。
对我来说唯一有用的是在文档就绪后添加一个空格来输入值,然后在用户专注于输入时删除空格。
$('.login-input').val(' ');
$('.login-input').on('focus', function() {
$(this).val('');
});
简单易行。 适用于Chrome 64.在Firefox中,您只需在输入中添加autocomplete="off"
属性即可。
我自己的解决方案jQuery与PrimeFaces。 在Chrome和Internet Explorer中测试过,但在mozilla Firefox中测试(虽然不在Firefox中)
<script type="text/javascript" charset="utf-8">
$(function(){
$('#frmLogin').on('submit',function(e){
$(PrimeFaces.escapeClientId('frmLogin:usuario')).replaceWith('<label id="frmLogin:usuario1" type="text" name="frmLogin:usuario1" autocomplete="off" class="form-control" maxlength="8" tabindex="2"/>');
$(PrimeFaces.escapeClientId('frmLogin:password')).replaceWith('<label id="frmLogin:password1" type="password" name="frmLogin:password1" autocomplete="off" value="" tabindex="3" class="form-control"/>');
$(PrimeFaces.escapeClientId('frmLogin:password1')).attr("autocomplete","off");
$(PrimeFaces.escapeClientId('frmLogin:usuario1')).attr("autocomplete","off");
$(PrimeFaces.escapeClientId('frmLogin:password_hid')).attr("autocomplete","off");
$(PrimeFaces.escapeClientId('frmLogin:usuario_hid')).attr("autocomplete","off");
});
});
</script>
<h:inputSecret id="password" value="#{loginMB.password}" class="form-control"
placeholder="Contraseña" tabindex="3" label="Contraseña" autocomplete="off" disabled="#{loginMB.bdisabled}"/>
<p:inputText value="#{loginMB.password_hid}" id="password_hid" type="hidden" />
如果您选择让Google Chrome保存网站密码,则每次登录新网站时都会看到提示。 如果在提示中单击“从不”这个站点,则不会保存站点的密码,并且该站点将添加到从未保存的密码列表中。
您可以编辑此列表并禁用提示:
点击浏览器工具栏上的Chrome菜单Chrome菜单。 选择设置。 单击显示高级设置。 单击管理已保存的密码 在出现的“密码”对话框中,向下滚动到底部的“从未保存”部分。 要从此列表中删除网站,请选择该网站,然后单击显示在该行末尾的X. 现在重新访问该网站,如果您允许Google Chrome显示提示,您应该会看到再次保存密码信息的提示。