ajax跨域请求的处理
Posted 昨日的世界
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ajax跨域请求的处理相关的知识,希望对你有一定的参考价值。
跨域的情形有很多种,网上有人给出了一份表格,
表格中标识为”不允许”通信的情况都属于跨域。实际网络服务中需要跨域的情况确实存在,于是开发者们提供了一种解决方案,就是使用jsonp格式进行数据交互,它不是标准的json格式,而是形如”callback(json)”的格式,这样在使用ajax跨域请求的时候就需要对后台的返回值做一下处理,不能返回json数据了。
不跨域时的ajax请求一般是:
$.ajax({
type: \'POST\',
url: "getData.do",
dataType:\'json\',
data:{id:id },
async:true,
success: function (data) {
$.messager.alert(\'OOOOPS\',\'请求成功!\',\'info\');
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
//请求失败处理函数
// alert(XMLHttpRequest.status);//404
// alert(XMLHttpRequest.readyState);//4
// alert(textStatus); //error
$.messager.alert(\'TIPS\',textStatus,\'info\');
}
});
如果是跨域的请求,这个ajax就要改写成这样:
$.ajax({
type: \'POST\',
url: "getData.do",
dataType:\'jsonp\',
jsonp:\'callback\',
data:{id:id },
async:true,
success: function (data) {
$.messager.alert(\'OOOOPS\',\'请求成功!\',\'info\');
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
//请求失败处理函数
// alert(XMLHttpRequest.status);//404
// alert(XMLHttpRequest.readyState);//4
// alert(textStatus); //error
$.messager.alert(\'TIPS\',textStatus,\'info\');
}
});
那么后台方法的接口也要做相应的修改,因为多了个参数jsonp啊!
@RequestMapping("getData")
@ResponseBody
public String queryData(HttpServletRequest request,String id) {
String callback = request.getParameter("callback");//接收ajax传递的jsonp参数
//中间数据处理的代码段
String res = callback+"({\'sucess\':\'true\'})";
return res; //返回值给ajax回调函数
}
以上是关于ajax跨域请求的处理的主要内容,如果未能解决你的问题,请参考以下文章