使用mvc3实现ajax跨域

ajax跨域一般两种方式   1:cors,2:jsonp,

1:cors

jsonp是get形式,承载的信息量有限,所以信息量较大时CORS是不二选择

在请求消息头添头 Access-Control-Allow-Origin  , 值可以为指定域名,也可以为*表示允许所有域名跨域仿问

mvc代码

public ActionResult Jump()
{
    Response.AddHeader("Access-Control-Allow-Origin","*");  //对请求方域名没有要求
    //Response.AddHeader("Access-Control-Allow-Origin","http://www.baidu.com");   只请允许百度对其进行跨域仿问
    return View();
}

客户端使用正常的jquery.ajax就可以调用此方法了。

2:jsonp

mvc3代码

实现类

public class JsonpResult : JsonResult
    {
        public JsonpResult()
        {
            JsonRequestBehavior = JsonRequestBehavior.AllowGet;
        }

        public string Callback { get; set; }

        ///<summary>
        ///对操作结果进行处理
        ///</summary>
        ///<paramname="context"></param>
        public override void ExecuteResult(ControllerContext context)
        {
            var httpContext = context.HttpContext;
            var callBack = Callback;
            if (string.IsNullOrWhiteSpace(callBack))
                callBack = httpContext.Request["callback"]; //获得客户端提交的回调函数名称
            // 返回客户端定义的回调函数
            var js = new System.Web.Script.Serialization.JavaScriptSerializer();
            httpContext.Response.Write(callBack + "(");
            httpContext.Response.Write(js.Serialize(Data));  //Data 是服务器返回的数据
            httpContext.Response.Write(");");            //将函数输出给客户端,由客户端执行
        }
    }

    /// <summary>
    /// jsonp扩展方法
    /// </summary>
    public static class ContollerExtensions
    {
        /// <summary>
        ///
        /// </summary>
        /// <typeparam name="T"></typeparam>
        /// <param name="controller"></param>
        /// <param name="data"></param>
        /// <returns></returns>
        public static JsonpResult Jsonp<T>(this Controller controller, T data)
        {
            JsonpResult result = new JsonpResult()
            {
                Data = data,
                JsonRequestBehavior = JsonRequestBehavior.AllowGet
            };
            return result;
        }

        /// <summary>
        ///
        /// </summary>
        /// <typeparam name="T"></typeparam>
        /// <param name="controller"></param>
        /// <param name="data"></param>
        /// <param name="callback">更改后的回调函数名</param>
        /// <returns></returns>
        public static JsonpResult Jsonp<T>(this Controller controller, T data,string callback)
        {
            JsonpResult result = new JsonpResult()
            {
                Callback=callback,
                Data = data,
                JsonRequestBehavior = JsonRequestBehavior.AllowGet
            };
            return result;
        }
    }

控制器

/// <summary>
        ///
        /// </summary>
        /// <param name="parameters">传入参数</param>
        /// <returns></returns>
        public ActionResult Jump(string parameters)
        {
            //以下返回方式都可以,在客户端接收json格式数据
            return this.Jsonp("");
            return this.Jsonp(new { success = true, message = "" });
            return this.Jsonp<类名>(类对象);
            return this.Jsonp(类对象);
        }

        /// <summary>
        ///
        /// </summary>
        /// <param name="parameters"></param>
        /// <param name="updatecallback">更改后的回调函数名</param>
        /// <returns></returns>
        public ActionResult Jump(string parameters, string updatecallback)
        {
            //以下返回方式都可以,在客户端接收json格式数据
            return this.Jsonp("", updatecallback);
            return this.Jsonp(new { success = true, message = "" }, updatecallback);
            return this.Jsonp<类名>(类对象, updatecallback);
            return this.Jsonp(类对象, updatecallback);
        }

客户端ajax

$.ajax({
            type: "GET",
            url: 请求地址,
            data:请求数据,
            dataType: "jsonp",    //必须注明数据格式是jsonp
            success: function (result) {
                alert(result.message);
            }
        });

$.ajax({
            type: "GET",
           url: 请求地址,
            data:请求数据,
            dataType: "jsonp",    //必须注明数据格式是jsonp
            jsonp: "updatecallback",  //修改回调函数名称
            success: function (result) {
                alert(result.message);
            }
        }

end

时间: 2024-10-19 19:12:28

使用mvc3实现ajax跨域的相关文章

Asp.net MVC3 实现jquery跨域获取json

JSONP可以帮我们解决跨域访问的问题.JSONP is JSON With Padding. 这里我们将不再解释其原理.我们来看在ASP.NET MVC 3 如何实现.首先我们需要定义一个JsonpResult. 代码像这样, 直接继承自JsonResult, override了ExecuteResult方法 public class JsonpResult : JsonResult { private static readonly string JsonpCallbackName = "c

jquery ajax跨域的完美解决方法(jsonp方式)

ajax跨域请求的问题,JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式,接下来为大家详细介绍下客户端JQuery.ajax的调用代码 今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发 JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式.分别是JQuery的 jquery.ajax jsonp格式和jquer

Ajax跨域与解决方案

1.同步交互与异步交互 同步交互:用户在URL地址输入http://www.baidu.com,服务器接收请求并进行相应处理,此时用户无法操作,只能等待,只有当返回数据到客户端的时候,用户才能继续操作异步交互:用户操作某个页面,请求某个数据,客户可以继续操作(服务器返回数据),不涉及到整个页面的刷新 2.XmlHttp XmlHttp是一套可以在Javascript.VbScript.Jscript等脚本语言中通过http协议传送或从接收XML及其他数据的一套API.XmlHttp最大的用处是可

AJAX跨域

AJAX跨域AJAX不允许跨域访问. 跨域是指浏览器B显示的是服务器S1的数据,全是从S1取得的数据则是同域:但如果B显示的S1上的数据的某个比如img是从S2上取得的数据,则是跨域.端口不一样也是跨域.跨域不仅是跨服务器,还是跨IP,跨端口. AJAX通过三种方法,可以解决跨域问题. 1.设置请求头,每一个路径里都要设置,可以封装成方法方便调用.       res.setHeader("Access-Control-Allow-Origin","*");   

JQuery的Ajax跨域请求的

JQuery的Ajax跨域请求的(Ajax) 什么是jsonp格式呢?API原文:假设获取的数据文件存放在远程server上(域名不同.也就是跨域获取数据),则须要使用jsonp类型.使用这样的类型的话,会创建一个查询字符串參数 callback=? .这个參数会加在请求的URL后面. server端应当在JSON数据前加上回调函数名.以便完毕一个有效的JSONP请求.意思就是远程服务端须要对返回的数据做下处理,依据client提交的callback的參数,返回一个callback(json)的

Ajax跨域访问wcf服务中所遇到的问题总结。

工具说明:vs2012,sql server 2008R2 1.首先,通过vs2012建立一个wcf服务项目,建立好之后.再新开一个vs2012 建立web项目,通过jQuery的ajax方法访问服务. 问题:由于web项目和wcf服务,不在同一个端口之中,所以涉及到“跨域”的问题.跨域访问的时候,需要对服务的接口和方法做一定的限定.具体参考:http://www.cnblogs.com/yangbingqi/p/2096197.html 2.解决了跨域问题,我们需要把服务部署到IIS.vs20

AJAX是什么? AJAX的交互模型(流程)?同步和异步的区别? AJAX跨域的解决办法?

ajax是异步的 JavaScript 和 XML.通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. 交互流程: 1--启动  获取XMlHttpRequest对象             2--open 打开url通道,并设置异步传输              3--send 发送数据到服务器             4--服务器接受数据并处理,处理完成后返回结果              5--客户端接收

解决Ajax跨域问题:Origin xx is not allowed by Access-Control-Allow-Origin.

解决Ajax跨域问题:Origin xx is not allowed by Access-Control-Allow-Origin. 今天一个Ajax跨域问题,纠结我半天,记录之. <html> <head> <title>title</title> <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> <script>

Ajax 跨域请求 jsonp获取json数据

遇到Ajax的跨域请求出问题 找了中解决办法如下: 参考内容:http://justcoding.iteye.com/blog/1366102 由于受到浏览器的限制,该方法不允许跨域通信.如果尝试从不同的域请求数据,会出现安全错误.如果能控制数 据驻留的远程服务器并且每个请求都前往同一域,就可以避免这些安全错误.但是,如果仅停留在自己的服务器上,Web 应用程序还有什么用处呢?如果需要从多个第三方服务器收集数据时,又该怎么办? 理解同源策略 同源策略阻止从一个域上加载的脚本获取或操作另一个域上的