使用ASP.NET Web API自带的类库实现对CORS的支持(在开发中使用这种方式)(转载)
2014-03-31 17:18
751 查看
在《通过扩展让ASP.NET Web API支持W3C的CORS规范》中我们通过自定义的HttpMessageHandler为ASP.NET Web API赋予了跨域资源共享的能力,具体来讲,这个自定义的CorsMessageHandler的自由主要体现在如下两个方面:其一,为简单跨域请求的响应和继预检请求后的真实跨域资源请求的响应添加CORS报头;其二,对从浏览器发送的预检请求予以响应。实际上ASP.NET Web API本身就提供了针对CORS的支持,就其实现原理来看,与我们的实现没有本质的区别。接下来我们通过实例演示如何利用ASP.NET Web API自身的支持来实现“跨域资源共享”。
[/code]
[/code]
和在《通过扩展让ASP.NET Web API支持W3C的CORS规范》实现CORS的实例一样,ASP.NET Web API自身也是借助于应用在HttpController类型或者定义其中的Action方法的特性来定义CORS授权策略的,这个特性类型为System.Web.Http.Cors.EnableCorsAttribute,它定义在程序集System.Web.Http.Cors.dll中。我们只需要按照如下的方式将EnableCorsAttribute特性应用到定义在ContactsController中的Action方法GetAllContacts上即可。
//[EnableCors(origins: "http://localhost:9527,http://localhost:2412", headers: "*", methods: "*")]//多个url以逗号分隔
[EnableCors(origins: "*", headers: "*", methods: "*")]//所有的url都可以
[/code]
[/code]
如上面的代码片断所示,我们为应用的EnableCorsAttribute特性指定了三个参数。根据参数名称和上面我们针对W3C的CORS规范的介绍,我们应该可以猜得到它们分别代表:授权的源站点,和请求所允许的自定义包头和HTTP方法。我们将客户端ASP.NET MVC应用所在的站点“http://localhost:9527”设置为授权的源站点,后两者则直接设置为“*”表示对此不作任何限制。
接下来们在MvcApp应用中定义如下一个HomeController,默认的Action方法Index会将对应的View呈现出来。
[/code]
[/code]
如下所示的是Action方法Index对应View的定义。我们的目的在于:当页面成功加载之后以Ajax请求的形式调用上面定义的Web API获取联系人列表,并将自呈现在页面上。如下面的代码片断所示,Ajax调用和返回数据的呈现是通过调用jQuery的getJSON方法完成的。
[/code]
[/code]
现在运行我们的ASP.NET MVC程序,依然可以得到如右图所示的输出结果。从编程的角度来讲,ASP.NET Web API针对CORS的实现仅仅涉及到两个方面:
其一,HttpConfiguration的扩展方法EnableCors,它用于开启ASP.NET Web API针对CORS的支持;
其二,EnableCorsAttribute特性,它为目标HttpController或者Action方法定义CORS授权策略。
注意:如果出现“System.Web.Http.GlobalConfiguration..cctor()' to access field 'System.Web.Http.GlobalConfiguration.CS$<>9__CachedAnonymousMethodDelegate2' ” 错误,请使用Nuget包安装“Microsoft ASP.NET Web API 2.1”
[code] public class WebApiApplication : System.Web.HttpApplication
{
protected void Application_Start()
{
GlobalConfiguration.Configuration.EnableCors();
//其他操作
}
}
[/code]
[/code]
和在《通过扩展让ASP.NET Web API支持W3C的CORS规范》实现CORS的实例一样,ASP.NET Web API自身也是借助于应用在HttpController类型或者定义其中的Action方法的特性来定义CORS授权策略的,这个特性类型为System.Web.Http.Cors.EnableCorsAttribute,它定义在程序集System.Web.Http.Cors.dll中。我们只需要按照如下的方式将EnableCorsAttribute特性应用到定义在ContactsController中的Action方法GetAllContacts上即可。
[code] [code] 1:
//[EnableCors(origins: "http://localhost:9527,http://localhost:2412", headers: "*", methods: "*")]//多个url以逗号分隔
[EnableCors(origins: "*", headers: "*", methods: "*")]//所有的url都可以
public class ContactsController : ApiController
{
public IHttpActionResult GetAllContacts()
{
Contact[] contacts = new Contact[]
{
new Contact{ Name="张三", PhoneNo="123", EmailAddress="zhangsan@gmail.com"},
new Contact{ Name="李四", PhoneNo="456", EmailAddress="lisi@gmail.com"},
new Contact{ Name="王五", PhoneNo="789",EmailAddress="wangwu@gmail.com"},
};
return Json<IEnumerable<Contact>>(contacts);
}
}
public class Contact
{
public string Name{ get; set;}
public string PhoneNo{ get; set;}
public string EmailAddress{ get; set;}
}
[/code]
[/code]
如上面的代码片断所示,我们为应用的EnableCorsAttribute特性指定了三个参数。根据参数名称和上面我们针对W3C的CORS规范的介绍,我们应该可以猜得到它们分别代表:授权的源站点,和请求所允许的自定义包头和HTTP方法。我们将客户端ASP.NET MVC应用所在的站点“http://localhost:9527”设置为授权的源站点,后两者则直接设置为“*”表示对此不作任何限制。
接下来们在MvcApp应用中定义如下一个HomeController,默认的Action方法Index会将对应的View呈现出来。
[code] [code] public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
}
[/code]
[/code]
如下所示的是Action方法Index对应View的定义。我们的目的在于:当页面成功加载之后以Ajax请求的形式调用上面定义的Web API获取联系人列表,并将自呈现在页面上。如下面的代码片断所示,Ajax调用和返回数据的呈现是通过调用jQuery的getJSON方法完成的。
[code] [code] <html>
<head>
<title>联系人列表</title>
<script type="text/javascript" src="@Url.Content("~/scripts/jquery-1.10.2.js")"></script>
</head>
<body>
<ul id="contacts"></ul>
<script type="text/javascript">
$(function ()
{
var url = "http://localhost:3721/api/contacts";
$.getJSON(url, null, function (contacts){
$.each(contacts, function (index, contact)
{
var html = "<li><ul>";
html += "<li>Name: " + contact.Name + "</li>";
html += "<li>Phone No:" + contact.PhoneNo + "</li>";
html += "<li>Email Address: " + contact.EmailAddress + "</li>";
html += "</ul>";
$("#contacts").append($(html));
});
});
});
</script>
</body>
</html>
[/code]
[/code]
现在运行我们的ASP.NET MVC程序,依然可以得到如右图所示的输出结果。从编程的角度来讲,ASP.NET Web API针对CORS的实现仅仅涉及到两个方面:
其一,HttpConfiguration的扩展方法EnableCors,它用于开启ASP.NET Web API针对CORS的支持;
其二,EnableCorsAttribute特性,它为目标HttpController或者Action方法定义CORS授权策略。
注意:如果出现“System.Web.Http.GlobalConfiguration..cctor()' to access field 'System.Web.Http.GlobalConfiguration.CS$<>9__CachedAnonymousMethodDelegate2' ” 错误,请使用Nuget包安装“Microsoft ASP.NET Web API 2.1”
相关文章推荐
- 如何在ASP.NET大型应用系统的模块化开发实现多版本程序集并存支持[转载]
- 通过微软的cors类库,让ASP.NET Web API 支持 CORS
- 通过扩展让ASP.NET Web API支持W3C的CORS规范(转载)
- 通过微软的cors类库,让ASP.NET Web API 支持 CORS
- 通过微软的cors类库,让ASP.NET Web API 支持 CORS
- 如何使用ASP.NET Web API OData在Oracle中使用Entity Framework 6.x Code-First方式开发 OData V4 Service
- 使用ASP.NET Web Api构建基于REST风格的服务实战系列教程【六】——实现资源间的关联
- 使用Autofac在ASP.NET Web API上实现依赖注入
- 使用PureMVC实现ASP.NET的MVC结构开发
- 使用ASP.NET Web Api构建基于REST风格的服务实战系列教程【七】——实现资源的分页
- ASP.NET Web API实现微信公众平台开发(一)服务器验证
- [CORS:跨域资源共享] 通过扩展让ASP.NET Web API支持W3C的CORS规范
- [CORS:跨域资源共享] ASP.NET Web API自身对CORS的支持: CORS授权检验的实施
- asp.net中使用自定义控件的方式实现一个分页控件的代码
- 使用ASP.NET Web Api构建基于REST风格的服务实战系列教程【六】——实现资源间的关联
- ASP.NET Web API自身对CORS的支持:从实例开始
- 支持Ajax跨域访问ASP.NET Web Api 2(Cors)的示例教程
- 基于.Net Framework 4.0 Web API开发(3):ASP.NET Web APIs 异常的统一处理Attribute 和统一写Log 的Attribute的实现
- 支持Ajax跨域访问ASP.NET Web Api 2(Cors)的示例
- 访问Access数据库实现DropDownList二级异步联动(ASP.NET WebForm开发方式)