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调用[/code]

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
}
});
}