Javascript 带有 jQuery AJAX 的 JSONP 回调函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7613815/
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
Callback function for JSONP with jQuery AJAX
提问by Bani
I didn't quite understand how to work with the callback for the ajax function of jQuery.
我不太明白如何使用 jQuery 的 ajax 函数的回调。
I have the following code in the JavaScript:
我在 JavaScript 中有以下代码：
try {
$.ajax({
url: 'http://url.of.my.server/submit?callback=?',
cache: false,
type: 'POST',
data: $("#survey").serialize(),
dataType: "jsonp",
timeout: 200,
crossDomain: true,
jsonp: 'jsonp_callback',
success: function (data, status) {
mySurvey.closePopup();
},
error: function (xOptions, textStatus) {
mySurvey.closePopup();
}
});
} catch (err) {
mySurvey.closePopup();
}
And on the server side (AppEngine / Python) I get the value of the callback parameter and respond with
在服务器端（AppEngine/Python）我得到回调参数的值并用
self.response.headers['Content-Type'] = 'application/json; charset=utf-8'
self.response.out.write(callback + '({"msg": "ok"});')
But then I get an "Error: jQuery152042227689944248825_1317400799214 is not a function"in the browser console.
但是后来我"Error: jQuery152042227689944248825_1317400799214 is not a function"在浏览器控制台中得到了一个。
What is the proper way to handle this? Right now I get the results that I need, but the fact that I know it's not right is bothering me.
处理这个问题的正确方法是什么？现在我得到了我需要的结果，但我知道这是不正确的这一事实让我感到困扰。
回答by atbebtg
This is what I do on mine
这就是我在我的身上所做的
$(document).ready(function() {
if ($('#userForm').valid()) {
var formData = $("#userForm").serializeArray();
$.ajax({
url: 'http://www.example.com/user/' + $('#Id').val() + '?callback=?',
type: "GET",
data: formData,
dataType: "jsonp",
jsonpCallback: "localJsonpCallback"
});
});
function localJsonpCallback(json) {
if (!json.Error) {
$('#resultForm').submit();
} else {
$('#loading').hide();
$('#userForm').show();
alert(json.Message);
}
}
回答by Joe
delete this line:
删除这一行：
jsonp: 'jsonp_callback',
Or replace this line:
或替换此行：
url: 'http://url.of.my.server/submit?callback=json_callback',
because currently you are asking jQuery to create a random callback function name with callback=?and then telling jQuery that you want to use jsonp_callbackinstead.
因为目前您要求 jQuery 创建一个随机的回调函数名称，callback=?然后告诉 jQuery 您想jsonp_callback改用它。
回答by Abdelfattah Ragab
$.ajax({
url: 'http://url.of.my.server/submit',
dataType: "jsonp",
jsonp: 'callback',
jsonpCallback: 'jsonp_callback'
});
jsonpis the querystring parameter name that is defined to be acceptable by the server while the jsonpCallbackis the javascript function name to be executed at the client.
When you use such url:
jsonp是定义为服务器可接受的查询字符串参数名称，而jsonpCallback是要在客户端执行的 javascript 函数名称。
当您使用这样的网址时：
url: 'http://url.of.my.server/submit?callback=?'
the question mark ? at the end instructs jQuery to generate a random function while the predfined behavior of the autogenerated function will just invoke the callback -the sucess function in this case- passing the json data as a parameter.
问号？最后指示 jQuery 生成一个随机函数，而自动生成函数的预定义行为只会调用回调 - 在这种情况下是成功函数 - 将 json 数据作为参数传递。
$.ajax({
url: 'http://url.of.my.server/submit?callback=?',
success: function (data, status) {
mySurvey.closePopup();
},
error: function (xOptions, textStatus) {
mySurvey.closePopup();
}
});
The same goes here if you are using $.getJSON with ? placeholder it will generate a random function while the predfined behavior of the autogenerated function will just invoke the callback:
如果您将 $.getJSON 与 ? 占位符它将生成一个随机函数，而自动生成函数的预定义行为将只调用回调：
$.getJSON('http://url.of.my.server/submit?callback=?',function(data){
//process data here
});
