javascript 将数据传递给 CGI 脚本并使用 jQuery.ajax 返回
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18485793/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Pass data to CGI script and back with jQuery.ajax
提问by atreju
I'm working with jQuery.ajax()to send some HTML form data to my Perl script on the server and then return some data back to the frontend.
我正在使用jQuery.ajax()将一些 HTML 表单数据发送到服务器上的 Perl 脚本，然后将一些数据返回给前端。
Preferably, the data should be in text/string format. I also need to save it as a variable for further use in jQuery functions.
最好，数据应该是文本/字符串格式。我还需要将它保存为一个变量，以便在 jQuery 函数中进一步使用。
I already set up the HTMLcode, the JavaScriptcode and the CGI Perlscript, but while JavaScript is working, the connection to the CGI Perl script is not and I always get the error message: "script call was not successful".
我已经设置了HTML代码、JavaScript代码和CGI Perl脚本，但是当 JavaScript 工作时，与 CGI Perl 脚本的连接却没有，我总是收到错误消息：“脚本调用不成功”。
Maybe some one can tell me where the mistake is? I'm not completely sure how to return the variable from the Perl script back to the server.
也许有人可以告诉我错误在哪里？我不完全确定如何将变量从 Perl 脚本返回到服务器。
Since I'm still new to both jQuery and JavaScript and haven't worked with asynchronous calls before, any help would be greatly appreciated.
由于我还是 jQuery 和 JavaScript 的新手，并且以前没有使用过异步调用，因此非常感谢任何帮助。
This is my code:
这是我的代码：
The HTML code:(where the user fills the form with his first name and name:
HTML 代码：（用户用他的名字和名字填写表单：
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="get_names.js"></script>
</head>
<body>
<div id="loginContent" class="container">
<div id="loginResult" style="display:none;">
</div>
<form id="loginForm" name="loginForm" method="post" action="">
<fieldset>
<legend>Enter information</legend>
<p>
<label for="firstname">First name</label>
<br />
<input type="text" id="firstname" name="firstname" class="text" size="20" />
</p>
<p>
<label for="name">Name</label>
<br />
<input type="test" id="name" name="name" class="text" size="20" />
</p>
<p>
<button type="submit" class="button positive">
Login
</button>
</p>
</fieldset>
</form>
</div>
</body>
</html>
The JavaScript Code:
JavaScript 代码：
$(document).ready(function(){
$("form#loginForm").submit(function() { // loginForm is submitted
var firstname = $('#firstname').attr('value'); // get first name
var name = $('#name').attr('value'); // get name
if (firstname && name) { // values are not empty
$.ajax({
type: "POST",
url: "/cgi-bin/perl_script.cgi", // URL of the Perl script
// send firstname and name as parameters to the Perl script
data: "firstname=" + firstname + "&name=" + name,
// script call was *not* successful
error: function() {
alert("script call was not successful");
},
// script call was successful
// perl_data should contain the string returned by the Perl script
success: function(perl_data){
alert("Your name is: " + perl_data)
}
});
}
else {
$('div#loginResult').text("Enter your name");
$('div#loginResult').addClass("error");
}
$('div#loginResult').fadeIn();
return false;
});
});
The Perl code:
Perl 代码：
#!/usr/bin/perl -w
use CGI;
use strict;
use warnings;
# read the CGI params
my $cgi = CGI->new;
my $firstname = $cgi->param("firstname");
my $name = $cgi->param("name");
my $completename = $firstname . $name;
print $completename;
回答by daxim
The problem is in the Perl program. It does not compile. It does not send the required HTTP headers. Add print $cgi->header('text/plain;charset=UTF-8');or similar and take care to encode the output appropriate for the content type.
问题出在 Perl 程序中。它不编译。它不发送所需的 HTTP 标头。添加print $cgi->header('text/plain;charset=UTF-8');或类似并注意编码适合内容类型的输出。
