通过微软的cors类库，让ASP.NET Web API 支持 CORS

时间：2022-04-18 02:25:50

前言：因为公司项目需要搭建一个Web API 的后端，用来传输一些数据以及文件，之前有听过Web API的相关说明，但是真正实现的时候，感觉还是需要挺多知识的，正好今天有空，整理一下这周关于解决CORS的问题，让自己理一理相关的知识。

ASP.NET Web API支持CORS方式，据我目前在网上搜索，有两种方式

通过扩展CorsMessageHandle实现：            

通过微软的 AspNet.WebApi.Cors 类库实现  #intro

本文主要是利用AspNet.WebApi.Cors 类库实现CORS，因为在选择的过程中，发现扩展的CorsMessageHandle会有一些限制，因为真正项目的HTTP Request 是Rang Request.

你需要了解的一些知识

Web API 2.0             

同源策略与JSONP    

CORS                        

1.创建Web API （myservice.azurewebsites.net）

这个简单放上图：

1.1

1.2

1.3

1.4

1.5

1.6将下面的code替代原来的TestController

using System.Net.Http;using System.Web.Http;namespace WebService.Controllers{ public class TestController : ApiController { public HttpResponseMessage Get() { return new HttpResponseMessage() { Content = new StringContent("GET: Test message") }; } public HttpResponseMessage Post() { return new HttpResponseMessage() { Content = new StringContent("POST: Test message") }; } public HttpResponseMessage Put() { return new HttpResponseMessage() { Content = new StringContent("PUT: Test message") }; } }}

1.7 可以测试创建的Web API是否可以正常工作

2.创建Client端(myclilent.azurewebsites.net)

这也是可以简单上图：

2.1

2.2

2.3 找到 Client端的 Views/Home/Index.cshtml，用下面代码替代

<div> <select> <option value="get">GET</option> <option value="post">POST</option> <option value="put">PUT</option> </select> <input type="button" value="Try it" /> <span id=‘value1‘>(Result)</span></div>@section scripts {<script> var serviceUrl = ‘‘; // Replace with your URI. function sendRequest() { var method = $(‘#method‘).val(); $.ajax({ type: method, url: serviceUrl }).done(function (data) { $(‘#value1‘).text(data); }).error(function (jqXHR, textStatus, errorThrown) { $(‘#value1‘).text(jqXHR.responseText || textStatus); }); }</script>}

2.4用例外一个域名发布网站，然后进入Index 页面，选择 GET,POST,PUT 等，点击 Try it 按钮，就会发送请求到Web API, 因为Web API没有开启CORS，而通过AJAX请求，浏览器会提示 错误

3.Web API支持CORS

3.1打开VS，工具->库程序包管理器->程序包管理器控制台 ，输入下列命令：Install-Package Microsoft.AspNet.WebApi.Cors -Version 5.0.0  

注意 ：目前Nuget 上面最新的版本是5.2.0 ，但是我测试，下载的时候，会有一些关联的类库不是最新的，System.Net.Http.Formatting 要求是5.2，我在网上找不带这dll,因此建议安装 ：Microsoft.AspNet.WebApi.Cors 5.0就OK了。

Nuget 科普link:   

3.2 打开 WebApiConfig.Register 添加 config.EnableCors()

using System.Web.Http;namespace WebService{ public static class WebApiConfig { public static void Register(HttpConfiguration config) { // New code config.EnableCors(); config.Routes.MapHttpRoute( name: "DefaultApi", routeTemplate: "api/{controller}/{id}", defaults: new { id = RouteParameter.Optional } ); } }}

相关文章