使用 javascript 强制弹出 'update password'

Question

问题：

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

流程有点像这样：

Bootstrap 模态弹出窗口
用户输入文本
在模态 'Ok' 上触发获取以更新数据库。
在 API 上确认 [以某种方式触发 firefox/chrome/etc 中的 'update your password' 对话。]

由于之前的混淆：'update your password'对话框是指获取的浏览器密码管理器弹出窗口发送登录表单时显示。

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 提交的 'dead' 端点的隐藏表单。

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

感觉像是黑客
我不想创建不必要的请求
创建和销毁 DOM-仅供 Javascript 使用的元素不是 'the clean way'（据我所知）
这一定很常见，我是不是漏了一个API？

提前致谢！
- 史蒂夫

Answer 1

浏览器不允许您强制执行此操作。首先，用户可以在本地禁用该功能。最重要的是，如果该网站可以强制显示与安全相关的弹出窗口，它可能会允许一些非常讨厌的攻击。

使用 javascript 强制弹出 'update password'

Force 'update password' popup using javascript

javascript

passwords

optimization

vue.js

bootstrap-4

问题：