Javascript 防止Chrome从输入框提示保存密码？

Chrome最近更新了一个恼人的弹出窗口，从地址栏中的一个图标弹出，当用户提交表单时提示在页面上保存密码。这个页面上没有其他输入框，也没有其他浏览器提示保存这个密码，所以我不知道为什么Chrome会这样做。它是一个密码，因此在输入框中不应显示为纯文本，但它不是一个应该保存的密码-它不是登录凭据。实际上，非常重要的是，计算机用户不知道这个密码——其他人必须为他们输入密码——因此，如果浏览器保存密码，那就不好了

如何防止Chrome（和所有浏览器）提示保存此密码

<form action="/..." method="post" onsubmit="return pwFormIsSubmittable();">
    <p>Password: <input autofocus="" type="password" name="1409_password" style="width:100px" tabindex="1" autocomplete="off"></p>
    <div class="tabSubmitButtons">
        <input type="button" name="event=default" value="Cancel" onclick="window.location='...'" tabindex="3">");
        <input type="submit" value="Submit" onclick="submitForm();" tabindex="2">
        <input type="hidden" name="begin" value="Yes">
        <!-- couple other hidden inputs -->
    </div>
</form>

密码：

");

---

在Chrome的更高版本中，他们决定忽略密码的autocomplete=“off”…请参见：

下面是另一个人用一个黑客解决方案回答这个问题，如果是项目要求，您可以尝试：

---

一种解决方案或解决方法是在真实密码输入框上方添加

。Chrome只会尝试保存找到的第一个密码，如果为空，则不会弹出对话框保存密码。

您可以在提交表单之前将密码字段的类型更改为文本：

<script type="text/javascript">
    function validate() {
    return true;

}

function copyPass() {
    document.getElementById("hidPassword").value = document.getElementById("passwordField").value;
 if (document.getElementById("passwordField").value != "") {
        var passwordLength = document.getElementById("passwordField").value.length;
       document.getElementById("passwordField").value =  "•".repeat(passwordLength);
    }
    document.getElementById("passwordField").type = 'text';
}

function changeType() {
    document.getElementById("passwordField").type = 'password';
 document.getElementById("passwordField").value = document.getElementById("hidPassword").value;
}
</script>
<form method="post" action="yoururl" runat="server">

      <input type="text" name="username" />
      <input type="password" id="passwordField" name="passwordField" onfocus="javascript:changeType()" onblur="javascript: copyPass()" />
          <input type="hidden" name="hidPassword" id="hidPassword" value="" />
      <input type="submit" runat="server" name="btnsubmit" value="Submit" onclick="javascript:return validate()" />

    </form>

函数验证（）{
返回true；
}
函数copyPass（）{
document.getElementById（“hidPassword”）.value=document.getElementById（“passwordField”）.value；
if（document.getElementById（“passwordField”）.value！=“”）{
var passwordLength=document.getElementById（“passwordField”）.value.length；
document.getElementById（“密码字段”）.value=“•”.repeat（密码长度）；
}
document.getElementById（“passwordField”）.type='text'；
}
函数changeType（）{
document.getElementById（“passwordField”）.type='password'；
document.getElementById（“passwordField”）.value=document.getElementById（“hidPassword”）.value；
}

浏览器之所以忽略

autocomplete=off

是因为有些网站试图禁用密码自动完成功能

这是错误的

2014年7月，Firefox成为最后一个最终实施更改的主流浏览器，该更改将忽略任何试图关闭密码自动补全功能的网站

• （）
• （）
• （）
• （）

任何网站试图绕过浏览器的首选项都是错误的；这就是为什么浏览器会忽略它。没有理由知道为什么网站应该尝试禁用保存密码

• Chrome忽略了它
• 萨法里对此视而不见
• 我不理它
• Edge忽略了它
• Firefox忽略了它

微软甚至不得不在IE11发布之前解释说，这不是浏览器中的一个bug——网站被破坏了：（）

如果我是一个特别的呢？ 有人提出了一个好的用例：

我有一台共享的、公共区域的、信息亭式的计算机。我们不希望有人（意外或故意）保存他们的密码，以便下一个用户可以使用它

这并不违反声明：

任何网站试图绕过浏览器的偏好都是错误的

这是因为在共享信息亭的情况下：

• 具有古怪策略的不是web服务器
• 具有古怪策略的是客户端用户代理

浏览器（共享计算机）要求它不保存密码

防止浏览器保存密码的正确方法
是将浏览器配置为不保存密码

由于您已锁定并控制此信息亭计算机：您可以控制设置。其中包括保存密码的选项

在Chrome和Internet Explorer中，您可以使用组策略（例如注册表项）配置这些选项

从：

自动填充已启用

---

启用自动填充

数据类型：布尔值（REG\u DWORD）

Windows注册表位置：Software\Policies\Chromium\AutoFillEnabled

说明：启用Chromium的自动填充功能，并允许用户使用以前存储的信息（如地址或信用卡信息）自动完成web表单。如果禁用此设置，用户将无法访问自动填充。如果启用此设置或未设置值，则自动填充将保持受控状态这将允许他们配置自动填充配置文件，并根据自己的判断打开或关闭自动填充

请告诉公司经理，试图禁用密码自动完成是错误的。这是错误的，以至于浏览器故意忽略任何试图这样做的人。这些人应该停止做错误的事情。™

---

我们需要防止政府、公司政策、安全审计员、PCI、HIPPA试图阻止用户保存密码。没有有效的用例阻止用户保存其凭据

• 如果有密码重置屏幕：应在无掩码的纯文本框中输入密码
• 如果需要2FA密码：应在无掩码的纯文本框中输入密码
• 如果您有：密码应在无掩码的纯文本框中输入

您可以自由提出以下备选方案：

• 允许网站阻止保存密码
• 只要它不能用来阻止用户保存任何密码

换一种说法 换言之：

• 如果用户浏览器
• 错误“请输入您最喜爱的处女姓名的第一种颜色。”以获取新密码<

  <input name='username' type='text'>
  <input name='password' type='password' 
         onblur='this.type="password"'
         onfocus='this.type="text"'>
  

  $('input[name="password"]').blur(function(){
      $(this).attr('type', 'password')
  })
  $('input[name="password"]').focus(function(){
      $(this).attr('type', 'text')
  })
  

  <input type="text" id="password" style="-webkit-text-security: disc;">
  

  input { -webkit-text-security: none; }
  input { -webkit-text-security: circle; }
  input { -webkit-text-security: square; }
  input { -webkit-text-security: disc; /* Default */ }