禁用浏览器的“保存密码”功能

在政府医疗机构工作的乐趣之一是必须处理与PHI（受保护的健康信息）打交道有关的所有偏执狂。不要误会我的意思，我全力以赴来尽一切可能保护人们的个人信息（健康，财务，上网习惯等），但是有时候人们会显得有些过份。

恰当的例子：我们的一位州客户最近发现，该浏览器提供了方便的功能来保存您的密码。我们都知道它已经存在了一段时间，并且完全是可选的，并且最终用户可以决定是否使用它是明智的决定。但是，目前有一些骚动，我们被要求找到一种方法来禁用我们网站的功能。

问题：网站是否可以告诉浏览器不要提供记住密码的方法？我从事Web开发已有很长时间了，但是我不知道我以前曾遇到过。

任何帮助表示赞赏。

我不确定它是否可以在所有浏览器中使用，但是您应该尝试在表单上设置autocomplete =“ off”。

<form id="loginForm" action="login.cgi" method="post" autocomplete="off">

禁用“表单和密码”存储提示并防止将表单数据缓存在会话历史记录中的最简单方法是使用值为“ off”的自动完成表单元素属性。

来自http://developer.mozilla.org/En/How_to_Turn_Off_Form_Autocompletion

一些较小的研究表明，此方法可在IE中使用，但我不做任何保证;）

@Joseph：如果严格要求通过带有实际标记的XHTML验证（不知道为什么会这样），则理论上可以在以后使用javascript添加此属性，但是随后禁用了js的用户（用户群的数量可忽略不计）或零（如果您的站点需要js），则仍然会保存其密码。

jQuery示例：

$('#loginForm').attr('autocomplete', 'off');

此外

autocomplete="off"

采用

readonly onfocus="this.removeAttribute('readonly');"

对于输入，你不希望他们能记住表单数据（username，password等），如下图所示：

<input type="text" name="UserName" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" >

<input type="password" name="Password" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" >

测试在主流浏览器的最新版本的IE Google Chrome，Mozilla Firefox，Microsoft Edge等，像一个魅力的作品。希望这可以帮助。

我一直在为这个问题而苦苦挣扎，对这个问题有独特的看法。特权用户无法使用已保存的密码，但普通用户需要它。这意味着特权用户必须登录两次，第二次不执行任何保存的密码。

有了这一要求，标准autocomplete="off"方法就不能在所有浏览器上都适用，因为密码可能是从首次登录时保存的。一位同事找到了一种解决方案，当使用新的密码字段替换密码字段时将其替换，然后专注于新的密码字段（然后连接相同的事件处理程序）。这行得通（除非它在IE6中引起了无限循环）。也许可以解决这个问题，但这使我偏头痛。

最后，我尝试仅在表单之外输入用户名和密码。令我惊讶的是，这行得通！它适用于IE6，以及Linux和Firefox上的最新版本。我没有对其进行进一步的测试，但是我怀疑它可以在大多数浏览器（即使不是所有浏览器）中正​​常工作（但是，如果有一个浏览器不在乎是否没有表单，这也不会令我感到惊讶）。

这是一些示例代码，以及一些使其工作的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>

好吧，这是一个非常古老的职位，但我仍然会给出我的解决方案，我的团队一直在努力解决。我们只是在表单内添加了一个新的输入type =“ password”字段，并将其包装在div中，并使div隐藏。确保此div在实际密码输入之前。这对我们有用，并且没有提供任何“保存密码”选项

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;}

您可以通过随机化每个节目中用于密码字段的名称来防止浏览器匹配表格。然后，浏览器会看到与url相同的密码，但不能确定它是否为相同的password。也许它在控制其他东西。

更新：请注意，由于其他人指出的原因，这应该是在使用自动完成或其他策略的基础上进行的补充，而不是替代它们。

另请注意，这只会阻止浏览器自动填写密码。这不会阻止它以浏览器选择使用的任意安全级别存储密码。

使用真正的两因素身份验证可避免仅依赖密码，而密码可能存储在比用户浏览器缓存更多的地方。

最干净的方法是使用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"/>

这是一个丑陋的hack，因为您更改了浏览器的行为，应将其视为不良做法。仅在确实需要时使用它。

注意：这将有效地停止密码自动填充，因为FF会“保存” #prevent_autofill（空）值，并尝试在其中填充所有已保存的密码，因为它始终使用type="password"在相应“用户名”之后在DOM中找到的第一个输入。输入。

我已经测试过在所有主要浏览器的表单标签中添加autocomplete =“ off”。实际上，到目前为止，美国大多数人都在使用IE8。

1. IE8，IE9，IE10，Firefox，Safari都可以正常工作。

   浏览器不询问“保存密码”。同样，先前保存的用户名和密码也不会填充。

2. Chrome＆IE 11不支持autocomplete =“ off”功能
3. FF支持autocomplete =“ off”。但是有时会填充现有的已保存凭据。

2014年6月11日更新

最后，下面是一个使用javascript的跨浏览器解决方案，它在所有浏览器中都能正常工作。

需要删除登录表单中的“表单”标签。在客户端验证之后，将该凭据以隐藏形式放置并提交。

另外，添加两种方法。一个用于验证“ validateLogin（）”，另一个用于监听输入事件，同时在文本框/密码/按钮“ checkAndSubmit（）”中单击回车。因为现在登录表单没有表单标签，所以enter事件在这里不起作用。

的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);" /> 

Java脚本

//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”和使用javascript / jQuery清除密码字段结合在一起。

jQuery示例：

$(function() { 
    $('#PasswordEdit').attr("autocomplete", "off");
    setTimeout('$("#PasswordEdit").val("");', 50); 
});

通过使用，setTimeout()您可以等待浏览器完成该字段，然后再清除它，否则，清除该字段后，浏览器将始终自动完成。

如果autocomplete =“ off”不起作用...删除表单标签并改为使用div标签，然后使用jquery将表单值传递给服务器。这对我有用。

由于autocomplete =“ off”不适用于密码字段，因此必须依靠javascript。这是一个基于此处答案的简单解决方案。

将属性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');
        });
    });     
});

该解决方案适用于Chrome和FF。

人们意识到-“自动完成”属性在大多数情况下都有效，但是高级用户可以使用书签来解决它。

使用浏览器保存密码实际上可以增强对键盘记录的保护，因此，最安全的选择可能是将密码保存在浏览器中，但使用主密码来保护它们（至少在Firefox中）。

我有一个解决方法，可能会有所帮助。

您可以进行自定义字体修改。因此，制作一个自定义字体，所有字符都以点/圆/星为例。使用它作为您网站的自定义字体。检查如何在inkscape中执行此操作：如何制作自己的字体

然后在登录表单上使用：

<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。只要确保您转换的oet字体没有损坏即可。希望能帮助到你？

解决此问题的最简单方法是将INPUT字段放置在FORM标记之外，并在FORM标记内添加两个隐藏的字段。然后，在提交事件侦听器中，将表单数据提交到服务器之前，将其值从可见输入复制到不可见输入。

这是一个示例（由于form操作未设置为真实的登录脚本，因此您无法在此处运行它）：

<!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）解决方法是将密码输入类型更改为表单commit上的文本。密码可能会显示一秒钟，因此在此之前我也隐藏了输入。我不希望将其用于登录表单，但是它很有用（与autocomplete =“ off”一起使用），例如在网站的管理部分内部。

提交表单之前，请尝试将其放入控制台（带有jquery）中。

$('form').submit(function(event) {
    $(this).find('input[type=password]').css('visibility', 'hidden').attr('type', 'text');
});

在Chrome 44.0.2403.157（64位）上进行了测试。

我测试了很多解决方案。动态密码字段名称，多个密码字段（对于假密码字段不可见），将输入类型从“文本”更改为“密码”，autocomplete =“ off”，autocomplete =“ new-password”，...但是最近没有解决方案浏览器。

为了忘记密码，我终于将密码作为输入字段，并对输入的文本进行“模糊处理”。

它不如本地密码字段“安全”，因为选择键入的文本会将其显示为明文，但不会记住密码。它还取决于激活Javascript。

您将估计使用来自导航器的以下建议vs密码记住选项的风险。

尽管密码记忆可以由用户管理（按站点分配），但对于个人计算机，而不是“公用”或共享计算机，这是很好的选择。

我的情况是针对在共享计算机上运行的ERP，因此下面将尝试我的解决方案。

<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">

马库斯提出了一个观点。我决定查找该autocomplete属性，并得到以下信息：

使用此属性的唯一缺点是，它不是标准属性（在IE和Mozilla浏览器中适用），并且会导致XHTML验证失败。我认为在这种情况下，打破验证是合理的。 （来源）

因此，我不得不说，尽管它不能全面运行100％，但可以在主要的浏览器中进行处理，因此它是一个很好的解决方案。

我在上面尝试过autocomplete="off"，但仍然成功。如果您使用的是Angular JS，我的建议是使用button和ng-click。

<button type="button" class="" ng-click="vm.login()" />

这已经有了一个可接受的答案，如果有人用我的机制无法解决这个可接受的答案的问题，则可以添加这个答案。

感谢您的问题和答案。

我知道的一种方法是（例如）使用JavaScript在提交表单之前从密码字段中复制值。

这样做的主要问题是解决方案与JavaScript绑定在一起。

再说一次，如果可以将其绑定到JavaScript，则最好在向服务器发送请求之前在客户端对密码进行哈希处理。

真正的问题比向HTML添加属性要深得多-这是常见的安全问题，这就是为什么人们发明硬件密钥和其他疯狂的东西来保证安全的原因。

假设您在所有浏览器中都能完美地使用autocomplete =“ off”。这对安全性有帮助吗？当然不。用户将在教科书中的密码上写下他们的密码，在监视器上贴的贴纸上，每个办公室访问者都可以看到它们，并将其保存到桌面上的文本文件中，等等。

通常，Web应用程序和Web开发人员对最终用户的安全性不承担任何责任。最终用户只能保护自己。理想情况下，他们必须将所有密码都保留在头脑中，并使用密码重置功能（或与管理员联系）以防万一忘记密码。否则，总是存在以某种方式可以看到和窃取密码的风险。

因此，要么您有了一些带有硬件密钥的疯狂安全策略（例如，某些银行提供的Internet银行业务基本上采用了两因素身份验证），要么根本没有安全性。好吧，这当然有点夸张了。重要的是要了解您要防止什么：

1. 未经授权的访问。最简单的登录形式基本上就足够了。有时还会采取其他措施，例如随机安全性问题，CAPTCHA，密码强化等。
2. 凭证嗅探。如果人们从公共Wi-Fi热点等访问您的Web应用程序，则必须使用HTTPS。请注意，即使拥有HTTPS，您的用户也需要定期更改其密码。
3. 内部攻击。有两个这样的例子，从简单地从浏览器窃取密码或您在办公桌上某个地方写下的密码（不需要任何IT技能）开始，到会话伪造和拦截本地网络流量（甚至加密）结束。并像访问另一个最终用户一样进一步访问Web应用程序。

在这篇特别的文章中，我可以看到对开发人员的需求不足，由于问题的性质-最终用户安全性，他将无法解决这些需求。我的主观观点是，开发人员应该基本上说不，并指出需求问题，而不是老实地浪费时间在此类任务上。这并不能绝对使您的系统更安全，而是会导致在显示器上贴有贴纸的情况。不幸的是，有些老板只听到他们想听的话。但是，如果我是您，我将尝试解释实际问题的出处，而autocomplete =“ off”并不能解决问题，除非它将迫使用户将所有密码都保留在自己的头上！开发人员无法完全保护用户，

面对同样的HIPAA问题，找到了一个相对简单的解决方案，

1. 创建一个隐藏的密码字段，字段名称为数组。

   <input type="password" name="password[]" style="display:none" />
   

2. 对实际密码字段使用相同的数组。

   <input type="password" name="password[]" />
   

浏览器（Chrome）可能会提示您“保存密码”，但是无论用户是否选择“保存”，下次用户登录密码时，都会自动填充隐藏的密码字段，即阵列中的零位，而第一位为空白。

我尝试定义数组，例如“ password [part2]”，但它仍然记得。我认为，如果它是未索引的数组，则会将其丢弃，因为它别无选择，只能将其放在第一位。

然后，使用您选择的编程语言访问数组，例如PHP，

echo $_POST['password'][1];

由于大多数autocomplete建议（包括已接受的答案）在当今的网络浏览器中均不起作用（即，网络浏览器的密码管理器忽略autocomplete），因此，一种更新颖的解决方案是在password和text类型之间进行交换，并在字段中使背景颜色与文本颜色匹配是一个纯文本字段，当用户（或类似KeePass的程序）输入密码时，它将继续隐藏密码，同时仍然是真实的密码字段。浏览器不要求保存存储在纯文本字段中的密码。

这种方法的优势在于它允许逐步增强，因此不需要将Javascript用作正常的密码字段即可（您也可以以纯文本字段开头并应用相同的方法，但这并不是真正的HIPAA符合PHI / PII）。这种方法也不依赖于隐藏的表单/字段，这些表单/字段可能不一定会发送到服务器（因为它们是隐藏的），并且其中一些技巧在某些现代浏览器中也不起作用。

jQuery插件：

https://github.com/cubiclesoft/php-flexforms-modules/blob/master/password-manager/jquery.stoppasswordmanager.js

来自以上链接的相关源代码：

(function($) {
$.fn.StopPasswordManager = function() {
    return this.each(function() {
        var $this = $(this);

        $this.addClass('no-print');
        $this.attr('data-background-color', $this.css('background-color'));
        $this.css('background-color', $this.css('color'));
        $this.attr('type', 'text');
        $this.attr('autocomplete', 'off');

        $this.focus(function() {
            $this.attr('type', 'password');
            $this.css('background-color', $this.attr('data-background-color'));
        });

        $this.blur(function() {
            $this.css('background-color', $this.css('color'));
            $this.attr('type', 'text');
            $this[0].selectionStart = $this[0].selectionEnd;
        });

        $this.on('keydown', function(e) {
            if (e.keyCode == 13)
            {
                $this.css('background-color', $this.css('color'));
                $this.attr('type', 'text');
                $this[0].selectionStart = $this[0].selectionEnd;
            }
        });
    });
}
}(jQuery));

演示：

https://barebonescms.com/demos/admin_pack/admin.php

单击菜单中的“添加条目”，然后滚动到页面底部的“模块：停止密码管理器”。

免责声明：尽管此方法适用于有视力的人，但屏幕阅读器软件可能存在问题。例如，屏幕阅读器可能会大声读取用户密码，因为它会看到纯文本字段。使用上述插件可能还会带来其他无法预料的后果。应当通过测试各种条件和边缘情况来谨慎地更改内置的Web浏览器功能。

网站是否可以告诉浏览器不要提供记住密码的方法？

该网站通过使用告诉浏览器它是密码<input type="password">。因此，如果必须从网站角度执行此操作，则必须进行更改。（显然，我不建议这样做）。

最好的解决方案是让用户配置他们的浏览器，这样它就不会记住密码。

如果您不希望信任自动完成标志，则可以确保用户使用onchange事件在框中键入内容。下面的代码是一个简单的HTML表单。隐藏的表单元素password_edited开始设置为0。更改password的值时，顶部的JavaScript（pw_edited函数）将其值更改为1。按下按钮时，它将在提交表单之前检查此处的valueenter代码。 。这样，即使浏览器忽略了您并自动完成了该字段，用户也无法在不输入密码字段的情况下通过登录页面。另外，在设置焦点时，请确保空白密码字段。否则，您可以在最后添加一个字符，然后返回并删除它以欺骗系统。我建议另外在密码中添加autocomplete =“ off”，但是此示例显示了备份代码的工作方式。

<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”不适用于在Firefox 31中禁用密码管理器，并且在某些较早的版本中也很有可能也没有。

查看mozilla关于此问题的讨论： https //bugzilla.mozilla.org/show_bug.cgi? =956906

我们想使用第二个密码字段来输入由令牌生成的一次性密码。现在，我们使用文本输入而不是密码输入。:-(

经过大量的尝试和错误后，我被赋予了类似的任务来禁用浏览器自动填写登录名和密码，我发现以下解决方案是最佳的。只需在原始控件之前添加以下控件即可。

<input type="text" style="display:none">
<input type="text" name="OriginalLoginTextBox">

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

对于IE11和Chrome 44.0.2403.107来说，这工作正常

autocomplete =“ off”适用于大多数现代浏览器，但是我成功使用Epiphany（GNOME的WebKit驱动的浏览器）成功使用的另一种方法是将随机生成的前缀存储在会话状态（或隐藏字段，我碰巧有合适的会话状态变量），然后使用它来更改字段名称。主显节仍然要保存密码，但是当返回表格时，它不会填充字段。

使用此方法，我没有任何问题：

使用autocomplete =“ off”，添加一个隐藏的密码字段，然后添加另一个非隐藏的密码字段。如果浏览器不遵守autocomplete =“ off”，则尝试自动完成隐藏的浏览器

另一种解决方案是使用所有输入均为隐藏类型的隐藏形式进行POST。可见形式将使用“ password”类型的输入。后一种形式将永远不会提交，因此浏览器无法拦截所有登录操作。