CORS Via Web API 2

前言

介绍

** 简单的说，就是W3C先把你的手绑起来，然后再想个法子开个后门给你松松绑，就这样。这都是他们整出来黑我大代码党的幺蛾子。**

CORS通过让服务器标注哪些资源允许被跨域调用，来放宽这个限制。 Web API 2具有完整的CORS支持。使用Web API 2，您可以配置策略以允许来自不同来源的JavaScript客户端访问您的API。

正文

XMLHttpRequest cannot load XXXX. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
这个错误通常是因为你直接使用文件管理器打开的HTML文件，而FILE协议默认并不在支持中。只要你通过HTTP协议访问就可以避免这个问题了。
如果你确实想，非常想本地也能，咋办呢，还是有办法的...
** 给浏览器传入启动参数（allow-file-access-from-files），允许跨域访问。**
Windows下，运行（CMD+R）或建立快捷方式：
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files
Origin xxxx is not allowed by Access-Control-Allow-Origin
错误看起来像下图，
不允许域xxxx的请求
这个错误，说的是你发出请求的域，没有在服务器允许的范围之内。解决方法是修改web.config，找到这样的地方，没有就添加，有的话，就看看有啥不同，简单的说就是找不同，大家来找茬。

<system.webServer>
    <httpProtocol>
        <customHeaders>
            <!-- Adding the following custom HttpHeader 
                 will help prevent CORS from stopping the Request-->
            <add name="Access-Control-Allow-Origin" value="*" />
        </customHeaders>
    </httpProtocol>
</system.webServer>

入门的时候，你就这样写，反正死不了，高手的话，反正也不需要我说，应该知道，哪儿该花点心思。

Web.config中的配置参数表

<system.webServer>
    <httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="Content-Type" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
      </customHeaders>
    </httpProtocol>
</system.webServer>

可以根据需要，调整自己允许的Origin, Headers以及Mothods。

EnableCorsAttribute **
EnableCorsAttribute 类用于配置CORS策略，接受三个或四个参数，这些参数分别为：
** 允许的域列表 **
** 允许的请求头列表
** 允许的请求方法列表**
允许的响应头列表（可选）
代码看起来像下面这样

public class ResourcesController : ApiController
{
  [EnableCors("http://localhost:55912", // Origin
              null,                     // Request headers
              "GET",                    // HTTP methods
              "bar",                    // Response headers
              SupportsCredentials=true  // Allow credentials
  )]
  public HttpResponseMessage Get(int id)
  {
    var resp = Request.CreateResponse(HttpStatusCode.NoContent);
    resp.Headers.Add("bar", "a bar value");
    return resp;
  }
  [EnableCors("http://localhost:55912",       // Origin
              "Accept, Origin, Content-Type", // Request headers
              "PUT",                          // HTTP methods
              PreflightMaxAge=600             // Preflight cache duration
  )]
  public HttpResponseMessage Put(Resource data)
  {
    return Request.CreateResponse(HttpStatusCode.OK, data);
  }
  [EnableCors("http://localhost:55912",       // Origin
              "Accept, Origin, Content-Type", // Request headers
              "POST",                         // HTTP methods
              PreflightMaxAge=600             // Preflight cache duration
  )]
  public HttpResponseMessage Post(Resource data)
  {
    return Request.CreateResponse(HttpStatusCode.OK, data);
  }
}