Angular向ASP.NET Web API发请求遇CORS错误，求解决方法

我之前也踩过类似的CORS配置坑，结合你给出的代码和问题描述，咱们一步步梳理问题所在：

1. 先解决配置冲突问题 #

你同时在WebApiConfig.cs中使用了ASP.NET原生的EnableCorsAttribute，又在web.config里添加了IIS自定义CORS头，这两套配置会互相干扰，导致响应头混乱，浏览器无法正确识别。

解决方案：二选一保留一套配置，推荐保留WebApiConfig的原生配置，因为它是专门为Web API设计的，兼容性更好。直接删除web.config中<customHeaders>下的所有CORS相关配置。

2. 确认WebApiConfig的注册顺序 #

config.EnableCors(corsAttr)必须放在路由注册代码之前！如果顺序颠倒，CORS中间件不会对路由生效，这是很多人忽略的细节：

public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        // 第一步：启用CORS，必须在路由之前
        var corsAttr = new EnableCorsAttribute("http://localhost:4200", "*", "*"); // 本地测试可指定前端地址
        config.EnableCors(corsAttr);

        // 第二步：注册路由
        config.MapHttpAttributeRoutes();

        config.Routes.MapHttpRoute(
            name: "DefaultApi",
            routeTemplate: "api/{controller}/{id}",
            defaults: new { id = RouteParameter.Optional }
        );
    }
}

3. 检查OPTIONS请求处理模块的正确性 #

你添加的HandleOptions模块如果代码有问题，会导致预检请求无法正确响应。确保模块代码如下，不要重复添加CORS头，只需返回200状态并结束响应：

public class OptionsModule : IHttpModule
{
    public void Init(HttpApplication context)
    {
        context.BeginRequest += (sender, args) =>
        {
            var app = sender as HttpApplication;
            if (app?.Request.HttpMethod == "OPTIONS")
            {
                app.Response.StatusCode = 200;
                app.Response.End(); // 必须结束响应，避免后续处理干扰
            }
        };
    }

    public void Dispose() { }
}

4. 排查全局过滤器或中间件的干扰 #

如果你的Web API有自定义授权过滤器、异常过滤器，或者其他HTTP模块，可能会在CORS头返回前修改响应或终止请求。可以暂时注释掉这些自定义组件，测试CORS是否正常，逐步排查出干扰项。

5. 优化Angular请求与CORS配置的匹配 #

• 避免在CORS配置中过度使用*，本地测试时直接指定前端的具体地址（比如http://localhost:4200），部分浏览器对*的处理有安全限制。
• 如果请求中携带了自定义头（比如X-AuthToken），要在EnableCorsAttribute中明确允许这些头：

  var corsAttr = new EnableCorsAttribute(
      "http://localhost:4200", 
      "Content-Type, Authorization, X-AuthToken, X-Requested-With", 
      "GET, POST, PUT, DELETE, OPTIONS"
  );
  

最后一步：清空缓存并重启服务 #

浏览器会缓存之前的错误响应，导致新配置不生效。关闭所有浏览器窗口，重启ASP.NET Web API和Angular开发服务器，再重新测试请求。

内容的提问来源于stack exchange，提问作者Sean goodlip