[转载]由【说说JSON和JSONP..】博文,想到的MVC 扩展 – DotDot – 博客园.
前言
今天看到随它去吧大牛的 【原创】说说JSON和JSONP,也许你会豁然开朗,含jQuery用例 文章,利用JSONP的跨域令人倍感狂喜。于是想,自己动手针对ASP.NET MVC 进行一些扩展,让其更好的支持Jsonp。
关于 JSONP 的详情这里就不介绍了,请看 ——随它去吧: 【原创】说说JSON和JSONP,也许你会豁然开朗,含jQuery用例
扩展要点
- 默认约定 Callback 方法名为 Action名,当然也可以提供覆盖。
- 自定义JsonpResult,让其返回Js文件类型的响应,看过MVC 源码的同学都知道,这其实很简单(请打开MVC 源码中的JavaScriptResult.cs文件查看)。
- 为JsonpResult提供Json序列化器。同样参考MVC源码。
- 定义一个JsonpController 继承自Controller 方便使用JsonpResult。
其他:
除了上面3点外,我还定义了一个JsonpViewResult,故名思议就是可以支持View。
核心源码:
JsonpResult
public class JsonpResult : ActionResult
{
public string Json
{
get;
set;
}
public string Callback
{
get;
set;
}
public override void ExecuteResult(ControllerContext context)
{
if (context == null)
{
throw new ArgumentNullException("context");
}
HttpResponseBase response = context.HttpContext.Response;
response.ContentType = "application/x-javascript";
if (Callback == null)
{
Callback = context.RouteData.Values["action"].ToString();
}
response.Write(string.Format("{0}({1})", Callback, Json));
}
}
JsonpResult 里主要是设置Respone 里的 ContentType 类型, 同时判断Callback是否为null ,如果是则表示使用约定:以Action名为回调函数名。
JsonpViewResult
public class JsonpViewResult : ViewResult
{
public override void ExecuteResult(ControllerContext context)
{
base.ExecuteResult(context);
//if
//context.HttpContext.Request.UrlReferrer.Host=="YourDomain"
//return ContentType="text/Html"
//else:
HttpResponseBase response = context.HttpContext.Response;
response.ContentType = "application/x-javascript";
}
}
JsonpViewResult 只需要简单的继承ViewResult ,让后同样设置返回类型即可。
public class JsonpController : Controller
{
protected internal virtual ActionResult Jsonp(string json)
{
return new JsonpResult { Json = json };
}
protected internal virtual ActionResult Jsonp(string json, string callback)
{
return new JsonpResult { Json = json, Callback = callback };
}
protected internal virtual ActionResult Jsonp(object data)
{
JavaScriptSerializer serializer = new JavaScriptSerializer();
return new JsonpResult { Json = serializer.Serialize(data) };
}
protected internal virtual ActionResult Jsonp(object data, string callback)
{
JavaScriptSerializer serializer = new JavaScriptSerializer();
return new JsonpResult { Json = serializer.Serialize(data), Callback = callback };
}
protected internal virtual ActionResult Jsonp(object data, string callback, JavaScriptTypeResolver resolver)
{
JavaScriptSerializer serializer = new JavaScriptSerializer(resolver);
return new JsonpResult { Json = serializer.Serialize(data), Callback = callback };
}
protected internal virtual ActionResult Jsonp(object data, JavaScriptTypeResolver resolver)
{
JavaScriptSerializer serializer = new JavaScriptSerializer(resolver);
return new JsonpResult { Json = serializer.Serialize(data) };
}
protected internal ViewResult JsonpView(object model)
{
return JsonpView(null /* viewName */, model);
}
protected internal ViewResult JsonpView(string viewName, object model)
{
if (model != null)
{
ViewData.Model = model;
}
return new JsonpViewResult
{
ViewName = viewName,
ViewData = ViewData,
TempData = TempData
};
}
}
JsonpController 对 JsonpResult 和 JsonpViewResult 进行了封装方便使用。
使用示例
新建两个MVCApplictiong 项目,我这里为ASP.NET MVC 3 的项目
在第一个项目为本地域,主要进行Jsonp的跨域请求:
View
<h2>
Index</h2>
<script>
var GetCustomers = function (data) {
alert(data[0].Address );
};
var url = "http://localhost:1853/home/GetCustomers";
var script = document.createElement('script');
script.setAttribute('src', url);
document.getElementsByTagName('head')[0].appendChild(script);
</script>
<script>
var GetCustomer = function (data) {
alert(data.Address+" "+data.Name+" "+data.ID);
};
var url = "http://localhost:1853/home/Customer/2";
var script = document.createElement('script');
script.setAttribute('src', url);
document.getElementsByTagName('head')[0].appendChild(script);
</script>
<script>
var GetPI = function (data) {
alert(data);
};
var url = "http://localhost:1853/home/Calculate?callback=GetPI";
var script = document.createElement('script');
script.setAttribute('src', url);
document.getElementsByTagName('head')[0].appendChild(script);
</script>
第二个项目为远程域,它负责提供请求的数据封装:
Controller
public ActionResult GetCustomers()
{
var customers = new[]{
new Customer{ Address="长安街1", Id=1, Name="张三"},
new Customer{ Address="长安街2", Id=2, Name="李四"},
new Customer{ Address="长安街3", Id=3, Name="dudu"},
new Customer{ Address="长安街4", Id=4, Name="DotDot"},
new Customer{ Address="长安街5", Id=5, Name="随它去吧"}
};
return Jsonp(customers);
}
public ActionResult Customer(int id)
{
var customers = new[]{
new Customer{ Address="长安街1", Id=1, Name="张三"},
new Customer{ Address="长安街2", Id=2, Name="李四"},
new Customer{ Address="长安街3", Id=3, Name="dudu"},
new Customer{ Address="长安街4", Id=4, Name="DotDot"},
new Customer{ Address="长安街5", Id=5, Name="随它去吧"}
};
var customer = customers.FirstOrDefault(c => c.Id == id);
return JsonpView(customer);
}
public ActionResult Calculate(string callback)
{
var PI = Math.PI;
return Jsonp(PI, callback);
}
Controller中使用了 JsonpViewResult 因此可以对应的建立一个 View视图。在视图里直接指定Callback和Json数据(当然也可以利用绑定)
@model MvcApplication3.Models.Customer
@{
Layout = null;
}
GetCustomer( { Address:’@Model.Address’, ID:’@Model.Id’, Name:’@Model.Name’ } )
一些未考虑的事情
1、callback 方法为JS全局的
2、JsonpViewResult仍旧可以扩展成当为本域请求时显示Html,其他域则返回 Js,(可扩展对外服务)
示例源码:
https://github.com/IndexKey/JsonpExtengForAsp.net-MVC
Mikel