博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
使用jsonp解决Ajax跨域访问问题
阅读量:5960 次
发布时间:2019-06-19

本文共 1920 字,大约阅读时间需要 6 分钟。

hot3.png

在最近做的一个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),当前问题是本域和子域之间的相互访问。

解决跨域访问问题,有好几种方法,具体可参考这篇博客:

另外,还可以使用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如下:

 public ActionResult popup_login(string callback, string mail, string pwd, bool remember){     var jsonp = "isError:'{0}',msg:'{1}',href:'{2}',uname:'{3}',uid:'{4}'";            ///*进行登录处理,并得到处理结果*/     var userName = (CurrUser ?? ul).USER_NAME;     var userId = (CurrUser ?? ul).USER_ID;     jsonp = string.Format(jsonp, "true", "登录成功", "", userName, userId);     return Content(callback + "({" + jsonp + "})");}

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

更多关于jsonp的使用请参考博客:

 

 

 

转载于:https://my.oschina.net/u/1756499/blog/295144

你可能感兴趣的文章
微信开发学习总结(二)——微信开发入门
查看>>
JDK8新特性
查看>>
windows平台pthread库应用
查看>>
AS3 基本数据类型 primitive data type
查看>>
百度地图定位分享
查看>>
PostgreSQL数据类型-数据类型简介和布尔类型
查看>>
PostgreSQL数据类型-二进制数据和字符串数据类型与字符串函数
查看>>
安装应用的时候拷贝一个DB文件到应用database下
查看>>
shell 基础
查看>>
twisted的LineReceiver的接口定义
查看>>
浅解用PHP实现MVC
查看>>
MySQL常用操作
查看>>
Yxcms网站管理系统安装
查看>>
Android学习笔记---Matrix矩阵
查看>>
算法导论自学1-2章
查看>>
圆满结束【一对一私人定制,我和马哥有个约会】
查看>>
java中的Bean Validation
查看>>
spring-data-redis 使用过程中需要注意的一点
查看>>
vsftp
查看>>
Cloudera Hadoop 4系列实战课程(电商业日志流量分析项目)
查看>>