防止浏览器不记得密码答案

【问题标题】：Prevent Browsers not to remember password防止浏览器不记得密码
【发布时间】：2020-06-07 18:20:45
【问题描述】：

我们有一个带有登录屏幕的应用程序，其中包含输入字段文本和密码。我想在这里实现的是；

我尝试过的东西；

因此，如果有人使用任何其他解决方案取得了良好的结果，并且可以共享，那将是对开发者社区的巨大贡献。

【问题讨论】：

您可以使该字段看起来不像浏览器的密码字段，因此该消息不会显示在默认浏览器上，但如果有人真的想保存它，您无法阻止它。
什么是 HTML？您可以尝试从输入中删除属性。也可以尝试删除表单，但这使得 IIRC 更难访问
是的，它使它更难访问。我想继续使用类型属性密码的密码输入字段。否则会导致其他问题:(
这能回答你的问题吗？ How to disable Chrome's saved password prompt setting through JavaScript
为什么这甚至是你的目标？您是否试图强制用户每次都输入密码？如果是这样，这是将它们以明文形式存储的好方法。但是，如果您确实想这样做，您应该能够通过捕获键盘事件侦听器来模拟密码输入框。

【解决方案1】：

您应该将文本输入框放在画布内。
看看CanvasInput 和canvas-text-editor。

使用画布绘制输入框可以欺骗浏览器。

或者您可以在 div 上使用contenteditable。

【讨论】：

【解决方案2】：

这很棘手

原因是我们提交时浏览器总是关注输入字段类型。

例子

<input type="password">

使用 div 标签时浏览器不显示（保存弹窗）

例子（你想写一些巨大的逻辑来隐藏密码）

<div contenteditable="true">username</div>
<div contenteditable="true">password</div>

否则您想在浏览器中手动禁用自动填充和弹出窗口

【讨论】：

【解决方案3】：

在使用密码输入字段时不能这样做。我还强烈建议您不要使用常规输入字段，因为许多浏览器也将输入保存到这些字段（但以纯文本形式）。

在画布内使用文本框不利于可访问性，并且与旧版浏览器完全不兼容。

最好的办法是创建一个隐藏的div，您可以通过contenteditable 输入该密码，然后创建一个假密码输入叠加层，每次输入一个字符时添加一个•。这与常规密码输入在浏览器中的处理级别完全相同，但浏览器不会提示您保存它。

【讨论】：

【解决方案4】：

脚本无法阻止这种情况，唯一的阻止方法是您可以在浏览器设置中禁用自动填充。

【讨论】：