使用表单提交和重定向 [英] Using both form submission and redirection
问题描述
我目前有一种表单，它使用GET方法将数据提交给会员。问题是，当用户填写表单时，它们被重定向到GET操作所用的相同URL，它是一个随机代码的api页面。
I需要填写表单的用户重定向到我主持的感谢页面，而表单中的信息仍然会发送到该联属页面。
我不能操纵联属机构的api页面。我如何去做这件事？我听说过不同的答案，包括POST，Iframe，ajax，onsubmit。
有人可以证实哪种方法最好，为什么？
编辑在讨论聊天内容后，我们得出结论，服务器端发布是更好的方法。这里是一个实现的例子：
HTML：
< form id =my_form>
<！ - 表单元素 - >
< / form>
< div id =status_message>< / div>
Javascript：
（'submit'，function（e）{
$ .ajax（{
type：POST，
$（'＃my_form'）。
url：localProxy.php，
data：$（'＃my_form'）。serialize（），
success：function（response）{$ b $ // do something！
}，
error：function（）{
//处理错误
}
}）;
}）;
PHP（localProxy.php） b
$ b
$ ch = curl_init（）;
curl_setopt（$ ch，CURLOPT_URL，'http：//thirdpartydomain.internet/login_url.php'）;
curl_setopt（$ ch，CURLOPT_SSL_VERIFYPEER，FALSE）;
curl_setopt（$ ch，CURLOPT_USERAGENT，Mozilla / 5.0（Windows; U; Windows NT 5.1; en-US; rv：1.8.1.6）Gecko / 20070725 Firefox / 2.0.0.6）;
curl_setopt（$ ch，CURLOPT_TIMEOUT，60）;
curl_setopt（$ ch，CURLOPT_FOLLOWLOCATION，0）;
curl_setopt（$ ch，CURLOPT_RETURNTRANSFER，1）;
curl_setopt（$ ch，CURLOPT_POSTFIELDS，$ _POST）;
curl_setopt（$ ch，CURLOPT_POST，1）;
$ result = curl_exec（$ ch）;
curl_close（$ ch）;
//对您的数据做些什么（如果有的话），或者呈现谢谢页面
die（'< h1> Thanks！< / h1>' ）;
原始答案
有两种方法。
第一种方法，您提到（通过标签） jQuery - 在这种情况下，您可以使用jquery的 ajax 方法将数据发布到API 和，以将其发布到您自己的服务器上获取感谢信息。
< form id =my_form>
<！ - 表单元素 - >
< / form>
< div id =status_message>< / div>
...在您的就绪功能中：
var API_URL ='http://www.some-api-provider.com/api.php';
var MY_URL ='http://www.my-website.net/post_handler.php'; $（'＃my_form'）。on（'submit'，function（e）{
e.preventDefault（）;
var error = false;
//验证在这里，如果有错误，设置error = true;
if（error == true）{
alert（'There was a problem！'）; // do
return false;
}
$ .ajax（{
类型：'GET'，
url：API_URL，
data：$（'my_form'）。serialize（），
success：function（）{
$ .ajax（{
type：'POST'，
url： MY_URL，
data：$（'＃my_form'）。serialize（），
success：function（response）{
$（'status_message'）。html（response）;
），
error：function（）{
alert（'There was a problem！'）; // do something better than this！
}
}）;
}，
错误：function（）{
alert（'有问题！ '）; //做比这更好的事情！
}
}）;
返回false;
}）;
发生了什么？我们使用事件上的 它将序列化表单的数据，然后通过GET将其发送给API。只要有效，它会调用成功函数，然后通过POST将数据发送到您的服务器。 div 将事件侦听器绑定到表单的'submit'事件。当用户点击提交按钮时，该监听器代码将被调用。
status_message 会随着服务器返回的结果而更新。
在不知道您使用的是哪种服务器端技术的情况下，我无法举例说明，但如果您经过这条路线并遇到麻烦，您可以随时提出其他问题！
文档
-
jQuery.ajax（）- http://api.jquery.com/jQuery.ajax/ -
jQuery.on（）- http://api.jquery.com/on/ - PHP
curl- http://php.net/manual/en/book.curl.php - ASP.net
WebRequest教程 - http://msdn.microsoft.com/en-us/library/debx8sh9 .aspx
I currently have a form that is submitting data to an affiliate using the GET method. The problem is, when a user fills out the form they are redirected to that same URL as the GET action goes to, it is an api page of random code.
I need the user that fills out the form to be redirected to a thank you page that i host while the information from the form is still sent to that affiliate api page.
I cannot manipulate the affiliate api page. How do i go about doing this? I've heard different answers including POST, Iframe, ajax, onsubmit.
Can someone confirm which method will work the best and why?
Edit After discussing things in chat, we came to the conclusion that server-side posting was a better way to go. Here is an example of implementation:
HTML:
<form id="my_form">
<!-- form elements -->
</form>
<div id="status_message"></div>
Javascript:
$('#my_form').on('submit', function (e){
$.ajax({
type: "POST",
url: "localProxy.php",
data: $('#my_form').serialize(),
success: function (response) {
// do something!
},
error: function () {
// handle error
}
});
});
PHP (localProxy.php)
$ch = curl_init();
curl_setopt ($ch, CURLOPT_URL, 'http://thirdpartydomain.internet/login_url.php');
curl_setopt ($ch, CURLOPT_SSL_VERIFYPEER, FALSE);
curl_setopt ($ch, CURLOPT_USERAGENT, "Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6");
curl_setopt ($ch, CURLOPT_TIMEOUT, 60);
curl_setopt ($ch, CURLOPT_FOLLOWLOCATION, 0);
curl_setopt ($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt ($ch, CURLOPT_POSTFIELDS, $_POST);
curl_setopt ($ch, CURLOPT_POST, 1);
$result = curl_exec ($ch);
curl_close($ch);
// do something with the data on your end (if anything), or render the "thank you" page
die('<h1>Thanks!</h1>');
Original answer
There are a couple of approaches.
The first way, you mention (through the tag) that you have jQuery -- in that case, you can use jquery's ajax method to both post the data to the API and to post it to your own server to get the thank-you message.
<form id="my_form">
<!-- form elements -->
</form>
<div id="status_message"></div>
... in your "ready" function:
var API_URL = 'http://www.some-api-provider.com/api.php';
var MY_URL = 'http://www.my-website.net/post_handler.php';
$('#my_form').on('submit', function (e){
e.preventDefault();
var error = false;
// validation here, if there is an error, set error = true;
if (error == true) {
alert('There was a problem!'); // do something better than this!
return false;
}
$.ajax({
type: 'GET',
url: API_URL,
data: $('my_form').serialize(),
success: function () {
$.ajax({
type: 'POST',
url: MY_URL,
data: $('#my_form').serialize(),
success: function (response) {
$('status_message').html(response);
},
error: function () {
alert('There was a problem!'); // do something better than this!
}
});
},
error: function () {
alert('There was a problem!'); // do something better than this!
}
});
return false;
});
What's happening there? We use the on event to bind an event listener to the 'submit' event of the form. When the user clicks the Submit button, that listener code will be invoked.
It, in its turn, will serialize your form's data, then send it the API via GET. As long as that works, it will call the success function, which in turn will send the data to your server via POST. The div status_message will be updated with the result return from your server.
The other approach is to post the data to your server normally, then use cURL or some other server-side HTTP connectivity to submit the data to the API. I might favor this method, as it is less dependent on javascript; if your user has scripts turned off, the javascript method will fail.
Without knowing what server-side technology you're using, I couldn't give any example, but if you go that route and run into trouble, you can always ask another question!
Documentation
jQuery.ajax()- http://api.jquery.com/jQuery.ajax/jQuery.on()- http://api.jquery.com/on/- PHP
curl- http://php.net/manual/en/book.curl.php - ASP.net
WebRequesttutorial - http://msdn.microsoft.com/en-us/library/debx8sh9.aspx
这篇关于使用表单提交和重定向的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
