使用javascript强制“更新密码”弹出窗口答案

【问题标题】：Force 'update password' popup using javascript使用javascript强制“更新密码”弹出窗口
【发布时间】：2021-08-05 11:18:39
【问题描述】：

问题：

我正在尝试构建一个不使用表单提交的具有密码更改功能的 web 应用程序。

流程有点像这样：

引导模式弹出窗口
用户输入文字
在模态“Ok”时触发更新数据库的提取。
在 API 确认 [以某种方式触发 firefox/chrome/etc 中的“更新您的密码”对话框]

由于之前的混淆：“更新密码”对话框指的是浏览器密码管理器弹出窗口发送登录表单时显示。

picture of the popup i am talking about
（来源：https://linuxhint.com/force_firefox_never_save_passwords/）

技术栈：

如果相关的话，这里是我的技术栈：

Vue.js（除了 VueX 没有插件或模块）
Bootstrap（包含所有 js）

代码

<h1>Submit form: (Works)</h1>
<form action="/login" method="post">
    <input type="text" name="username" id="">
    <input type="password" name="password" id="">
    <button type="submit">Submit</button>
</form>

<h1>My version (simplified):</h1>
<p>Enter your new password</p>
<input type="text" v-model="password">

<!-- modal -->
<div class="modal">
    <p>Please enter your old password</p>
    <input type="text" v-model="old">
    <button @click="updatePassword">Update</button>
</div>

//vue stuff
function updatePassword(){
    // a fetch wrapper
    callAPI( '/api/update_password', { old:this.old, password:this.password } )
}

我尝试了什么：

我知道我可以使用一个隐藏的表单指向一个由 Javascript 提交的“死”端点。

为什么我不喜欢那个解决方案：

感觉就像一个黑客攻击
我不想创建不必要的请求
创建和销毁仅用于 Javascript 的 DOM 元素并不是“干净的方式”（据我所知）
这一定很常见，我是否缺少 API？

提前致谢！
- 史蒂夫特克

【问题讨论】：

请花时间阅读How to Ask，了解如何提高您的问题质量。
“不必要的请求”？
你指的update your password对话框是什么？
我指的是“Firefox 已检测到登录；您要我将其保存在 Firefox Lockwise 中吗”？如果找到多个登录名，也用于自动完成选择的弹出窗口。关于“不必要的请求”：我将一个表单发送到一个端点，该端点什么都不做，只是为了得到例如。 firefox 提示前面提到的弹出窗口是一个浪费的请求）
@Stevetec 浏览器不会想要允许你强制这样做。一方面，用户可以在本地禁用该功能。最重要的是，如果网站可以强制弹出与安全相关的弹出窗口，它可能会导致一些非常讨厌的攻击。

标签： javascript vue.js optimization bootstrap-4 passwords

【解决方案1】：

浏览器不想让你强制这样做。一方面，用户可以在本地禁用该功能。最重要的是，如果网站可以强制弹出与安全相关的弹出窗口，它可能会导致一些非常讨厌的攻击。

【讨论】：