如何禁用Chrome以自动填充用户名/电子邮件密码？

问题描述 投票：14回答：10

我知道它在SO上已被多次回答，但这适用于旧版本的Chrome。

我有Chrome版本53.0.2785.143。

我想禁用Chrome以自动填充密码字段，

我已经尝试了旧的SO答案中提到的所有方法，

方法1：

尝试使用假用户名密码。

<input style="display:none" type="text" name="fakeusernameremembered"/>
<input style="display:none" type="password" name="fakepasswordremembered"/>

方法2：

尝试使用autocomplete='new-password'和autocomplete='false'和autocomplete='off'

但它都不起作用。

html html5 google-chrome
10个回答
20
投票

试试这个display:none

<input type="text" name="prevent_autofill" id="prevent_autofill" value="" style="display:none;" />
<input type="password" name="password_fake" id="password_fake" value="" style="display:none;" />
<input type="password" name="password" id="password" value="" />

你也可以用jQuery来解决这个问题，希望这对你有帮助，如果没有请在这里发表评论，祝你好运:)

更新：

这取决于chrome版本，有时这对chrome新版本不起作用，所以你应该尝试很多东西来防止这个问题，也尝试这些代码片段并请发表评论发生了什么:)

解决方案2

$('form[autocomplete="off"] input, input[autocomplete="off"]').each(function () {

                var input = this;
                var name = $(input).attr('name');
                var id = $(input).attr('id');

                $(input).removeAttr('name');
                $(input).removeAttr('id');

                setTimeout(function () {
                    $(input).attr('name', name);
                    $(input).attr('id', id);
                }, 1);
            });

它从元素中删除“name”和“id”属性，并在1ms后将其分配回来。把它放在文件准备好了。

解决方案3

<input type="text" name="email">
<input type="password" name="password" autocomplete="new-password">

经过测试并可在Chrome 53中使用

解决方案4

尝试autocomplete="false"而不是autocomplete="off"或nofill

-3
投票

不幸的是没有什么对我有用（赢10，歌剧/铬）没有“新密码”，没有其他解决方案......内联风格也有问题，当它被隐藏时，自动完成进展

这是我的工作解决方案：我们需要两个type = password并首先通过外部css隐藏

textarea

CSS：

<input type="password" class="vapor zero">
<input
    id="hes"
    type="password"
    placeholder="actual password"
    autocomplete="off"
    autocomplete="false"
    autocorrect="off"
    name="password2"
    value=""
    autocomplete="new-password"
    required>

jquery杀手（只是肯定）：

.zero{
    width:0px !important;
    height:0px !important;
    padding:0 !important;
    border:1px solid white;
}
-7
投票

你可以尝试这种方式。

关闭自动填充如果您不希望每次填写表单时都看到保存的个人信息，则可以关闭自动填充。

打开Chrome。在右上角，单击“更多”，然后单击“设置”。

在底部，单击“显示高级设置”。

在“密码和表单”下，取消选中“启用自动填充功能，只需点击一下即可填写网络表单”。要重新打开自动填充，请再次选中此框。

2
投票
  1. 添加自动填充属性，其值为用户名的用户名。
  2. 如果您已实施“电子邮件优先”登录流程，将用户名和密码分成两个单独的表单，请在用于收集密码的表单中包含一个包含用户名的表单字段。当然，如果适合您的布局，您可以通过CSS隐藏此字段。
  3. 在登录表单中为密码字段添加值为current-password的自动填充属性。
  4. 在注册和更改密码表单上为密码字段添加值为new-password的自动完成属性。
  5. 如果您要求用户在注册或密码更新期间两次键入其密码，请在两个字段上添加新密码自动完成属性。 <input type="text" autocomplete="username"> <input type="password" autocomplete="current-password">
1
投票

在管理员想要更改用户的电子邮件/密码的情况下，自动填充用管理员和填写的管理员密码替换用户的电子邮件。

对我来说有用的是将字段（电子邮件，密码...）设置为禁用，并在加载页面后一秒钟启用tiemout。以这种方式，在浏览器自动填充忽略它们之后，用户可以使用它们。

风险是某些东西打破了js并且它们仍然不可用。

如果您的服务器部分不太依赖于输入名称，我建议只将它们更改为与登录表单中使用的不同 - 它们不会自动填充（除非您特别要求）。

否则这里是示例代码：

 <input id="email" type="email" name="email" value="[email protected]" disabled>
    <input id="password" type="password" name="password" disabled>

    <script>
    $(document).ready(function(){
         setTimeout(
            function(){
                $('#myform input[diabled]').removeAttr('disabled');
            }, 1000);
    );
    </script>
1
投票

如果输入type="password"，Chrome将只会自动填充密码 - 否则会冒着以明文形式泄露用户密码的风险。因此，在输入字段上使用type="text"，然后在用户关注输入时将type属性更改为"password"。

密码字段：

<input type="text" class="form-control" placeholder="Password"
    onfocus="this.setAttribute('type', 'password')" />

完整示例:(使用Bootstrap 3类和Font Awesome图标）

<form>
    <div class="form-group">
        <input type="text" class="form-control" placeholder="Email Address" />
    </div>
    <div class="form-group">
        <input type="text" class="form-control" placeholder="Password" 
            onfocus="this.setAttribute('type', 'password')" />
    </div>
    <div class="text-xs-center">
        <button type="submit" class="btn btn-primary" style="width: 100%;">
            <i class="fa fa-lock" style="padding-right: 10px;"></i> LOG IN
        </button>
    </div>
</form>
0
投票

一个可能的解决方案是初始将输入类型设置为“text”，然后为输入添加一个事件侦听器，一旦编辑了字段，就会将类型更新为“password”。这将允许您保留密码输入的所有功能，并希望绕过任何密码自动填充/管理器。就像是：

HTML

<input type='text' class='my-input' />

JS

const input = document.querySelector('.my-input');

input.addEventListener('keydown', () => {
    input.setAttribute('type', 'password');
});
0
投票

使用jQuery disableAutoFill插件

$('#login-form').disableAutoFill();

文件：https://github.com/terrylinooo/jquery.disableAutoFill

但是：Kua zxsw指出

0
投票

对于我，截至22/02/2019，我尝试了这些，但没有得到一个有效的解决方案。我试过https://terrylinooo.github.io/jquery.disableAutoFill/，visibility，display，看起来它不起作用。可能是因为我正在使用Material UI而遗漏了一些东西。

对我来说，我有两个解决方案。这是autocomplete代码，您可以使用与本机html css语法相同的属性

1）具有不透明度和位置

JSX

2）具有z-index和位置

 <input type="email" style={{opacity:"0", position:"absolute"}}/>
 <input type="password" style={{opacity:"0", position:"absolute"}}/>

希望这能节省一些人的时间。

0
投票

根据Mozilla doc，在大多数现代浏览器中，将自动完成设置为“关闭”不会阻止密码管理器询问用户是否要保存用户名和密码信息，或者是否自动填写网站登录表单中的值。

你必须使用

<input type="email" style={{zIndex:":-100", position:"absolute"}}/>
<input type="password" style={{zIndex:"-100", position:"absolute"}}/>

创建新帐户或更改密码时，应使用“输入新密码”或“确认新密码”字段，而不是可能存在的常规“输入当前密码”字段。浏览器可以使用它来避免意外填写现有密码并提供创建安全密码的帮助

您可以查看所有自动填充值autocomplete = "new-password" 以供参考和更好地理解。

-1
投票

我终于使用带有事件处理程序的here取得了成功，该事件处理程序替换了用“•”键入的每个字符。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.