以 HTML 格式提交表单后重定向到页面
Posted
技术标签:
【中文标题】以 HTML 格式提交表单后重定向到页面【英文标题】：Redirecting to a page after submitting form in HTML 【发布时间】：2017-10-28 12:13:03 【问题描述】：我对 html 编码还很陌生。在互联网上搜索了几个小时的方法后，我失败了，所以我在这里。我在这里设置了一个 CSRF 概念证明页面，我希望它重定向到另一个页面，该页面将执行 CSRF 已实现的有效负载。
<html>
<body>
<form action="https://website.com/action.php?" method="POST">
<input type="hidden" name="fullname" value="john" />
<input type="hidden" name="address" value="street 2, 32 ave" />
<input type="submit" value="Submit request" />
</form>
</body>
</html>
所以在使用这个表单提交之后，它所做的就是重定向到这个页面
但我希望它重定向到另一个 URL 并提交该表单。
【问题讨论】：
在您的操作中，我不确定您是否需要 ?。为什么不直接去 action.php 做你想做的事，然后从那里重定向到你想要的 url 我愿意，但该网站不归我所有，正如我所说，这是我向公司报告的 CSRF（跨站点请求伪造）概念证明。 【参考方案1】：对于其他遇到同样问题的人，我自己解决了。
<html>
<body>
<form target="_blank" action="https://website.com/action.php" method="POST">
<input type="hidden" name="fullname" value="Sam" />
<input type="hidden" name="city" value="Dubai " />
<input onclick="window.location.href = 'https://website.com/my-account';" type="submit" value="Submit request" />
</form>
</body>
</html>我所要做的就是将 target="_blank" 属性添加到表单的内联中，以在新页面中打开响应并使用提交按钮上的 onclick 重定向另一个页面。
【讨论】：
我很好奇 _blank 中的新页面在代码中的哪个位置关闭，然后仅将第一页重定向到我想要的任何页面？ @Ons Ali 我确实和你有同样的问题。并试图用你的回答解决我的问题。当我单击按钮时，页面正在重定向。但是表单中的数据没有保存在 API 中。你能看到我的吗，这是链接***.com/questions/62019718/… 是的，这个答案不正确。表单不向 API 提交数据。【参考方案2】：您需要使用 jQuery AJAX 或 XMLHttpRequest() 将数据发布到服务器。发布数据后，您可以通过window.location.href 将您的页面重定向到另一个页面。
例子：
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function()
if (this.readyState == 4 && this.status == 200)
window.location.href = 'https://website.com/my-account';
;
xhttp.open("POST", "demo_post.asp", true);
xhttp.send();
【讨论】：
【参考方案3】：您可以做的是，验证值，例如：
如果fullanme的输入值大于某个值长度，如果address的输入值大于某个值长度则重定向到新页面，否则显示输入错误。
// We access to the inputs by their id's
let fullname = document.getElementById("fullname");
let address = document.getElementById("address");
// Error messages
let errorElement = document.getElementById("name_error");
let errorElementAddress = document.getElementById("address_error");
// Form
let contactForm = document.getElementById("form");
// Event listener
contactForm.addEventListener("submit", function (e)
let messageName = [];
let messageAddress = [];
if (fullname.value === "" || fullname.value === null)
messageName.push("* This field is required");
if (address.value === "" || address.value === null)
messageAddress.push("* This field is required");
// Statement to shows the errors
if (messageName.length || messageAddress.length > 0)
e.preventDefault();
errorElement.innerText = messageName;
errorElementAddress.innerText = messageAddress;
// if the values length is filled and it's greater than 2 then redirect to this page
if (
(fullname.value.length > 2,
address.value.length > 2)
)
e.preventDefault();
window.location.assign("https://www.google.com");
);.error
color: #000;
.input-container
display: flex;
flex-direction: column;
margin: 1rem auto;
<html>
<body>
<form id="form" method="POST">
<div class="input-container">
<label>Full name:</label>
<input type="text" id="fullname" name="fullname">
<div class="error" id="name_error"></div>
</div>
<div class="input-container">
<label>Address:</label>
<input type="text" id="address" name="address">
<div class="error" id="address_error"></div>
</div>
<button type="submit" id="submit_button" value="Submit request" >Submit</button>
</form>
</body>
</html>【讨论】：
以上是关于以 HTML 格式提交表单后重定向到页面的主要内容，如果未能解决你的问题，请参考以下文章