加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

使用jsonp解决Ajax跨域访问问题

发布时间:2020-12-16 19:43:43 所属栏目:百科 来源:网络整理
导读:在最近做的一个mvc2项目中,需要让两个不同域名的项目进行交互。从其中一个项目向另一个项目发出一个Ajax请求,验证登录信息。但使用普通的返回一个JsonResult的方式返回结果时,在浏览器中报如下错误:XMLHttpRequest cannot load ' '. No 'Access-Control-

在最近做的一个mvc2项目中,需要让两个不同域名的项目进行交互。从其中一个项目向另一个项目发出一个Ajax请求,验证登录信息。但使用普通的返回一个JsonResult的方式返回结果时,在浏览器中报如下错误:XMLHttpRequest cannot load ' '. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' ' is therefore not allowed access.

这是由于Ajax是通过XMLHttpRequest对象进行异步数据交互,而浏览器出于安全方面的考虑,不允许js进行跨域操作。

跨域访问分为本域和子域的相互访问(http://www.aaa.com和http://sub.aaa.com)以及本域和其它域的相互访问(http://www.aaa.com和http://www.bbb.com),当前问题是本域和子域之间的相互访问。

解决跨域访问问题,有好几种方法,具体可参考这篇博客:http://www.cnblogs.com/hyl8218/archive/2010/03/12/1683265.html

另外,还可以使用jsonp的方法来解决。具体方法如下:

在页面中发送Ajax异步请求时,使用如下格式的方法:

$.ajax({
type:"post",url:"/user/passport/popup_login",data:{mail:loginName,pwd:loginPwd,remember:true,callback:"?"},dataType:"jsonp",success:function(data){
if(data.isError=="true"){
location.href=location.href;
}
else{
alert(data.msg);
$("#log").css({
"disabled":""
}).removeClass("wait_log");
}
},beforeSend:function(){
$("#log").css({
"disabled":"disabled"
}).addClass("wait_log");
}
});

处理该请求的action如下:

publicActionResultpopup_login(stringcallback,stringmail,stringpwd,boolremember){
varjsonp="isError:'{0}',msg:'{1}',href:'{2}',uname:'{3}',uid:'{4}'";

///*进行登录处理,并得到处理结果*/

varuserName=(CurrUser??ul).USER_NAME;
varuserId=(CurrUser??ul).USER_ID;
jsonp=string.Format(jsonp,"true","登录成功","",userName,userId);
returnContent(callback+"({"+jsonp+"})");
}

在Ajax请求时,如果没有特别指定jsonp的变量名,那么它默认就是为“callback”,请求参数的名称也必须为“callback”;如果有指定变量名,就以指定的名称为准。

更多关于jsonp的使用请参考博客:http://justcoding.iteye.com/blog/1366102

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读