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

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

这是因为Ajax是经过XMLHttpRequest对象进行异步数据交互,而浏览器出于安全方面的考虑,不容许js进行跨域操做。html

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

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

另外,还能够使用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”;若是有指定变量名,就以指定的名称为准。mvc

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

相关文章
相关标签/搜索