jsonp原理实例及mvc中的应用

最近用的工作用到了jsonp，记录一下

jsonp

简单的原理就是通过<script>标记引入一个定义好json数据的js，因为<script>标记是不受域名限制的

例子
<script type=text/javascript>
function callback(jsondata)
{
    alert(jsondata.UserName);
}
</script>
<script type=text/javascript>
callback({"UserName":"test","Age":11});
</script>
这个应该都能看懂，如果把
callback({"UserName":"test","Age":11});
保存成一个js文件，随便放到那个什么地方，然后这里直接引入这个js，也是能够执行的

jquery已经把这个过程都包装好，直接调用就可以得到json数据

mvc中调用

先定义好一个JsonpResult，

        public class JsonpResult<T> : ActionResult
        {
            public T Obj { get; set; }
            public string CallbackName { get; set; }

            public JsonpResult(T obj, string callback)
            {
                this.Obj = obj;
                this.CallbackName = callback;
            }

            public override void ExecuteResult(ControllerContext context)
            {
                var js = new System.Web.Script.Serialization.JavaScriptSerializer();
                var jsonp = this.CallbackName + "(" + js.Serialize(this.Obj) + ")";

                context.HttpContext.Response.ContentType = "application/json";
                context.HttpContext.Response.Write(jsonp);
            }
        }

Action写法

        public ActionResult GetJsonP(string callback)
        {
            if (string.IsNullOrEmpty(callback)) callback = "callback";
            User u=new User();
            //生成u对象
            return new JsonpResult<InpaiUser>(u, callback);
        }

action返回的就是一段js代码

callback({"UserId":45516,"UserName":"xxx"})

jquery调用

    function getUserInfo(checkUser) {
        $.ajax({
            type: "GET",
            url: "http://xxx/user/getjsonp?callback=?",
            cache: false,
            error: function () {
            },
            jsonp: "callback",
            dataType: "jsonp",
            success: function (result) {
                checkUser(result);//checkUser是一个处理user对象的function
            }
        });
    }