对预检请求的响应未通过访问控制检查 (Angular2)答案

【问题标题】：Response to preflight request doesn't pass access control check (Angular2)对预检请求的响应未通过访问控制检查 (Angular2)
【发布时间】：2017-03-25 16:12:51
【问题描述】：

在 Asp.net 中调用 REST Web API 时出现以下错误。

XMLHttpRequest 无法加载 http://localhost:54859/api/PostData。对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此不允许访问 Origin 'http://localhost:3000'。

我使用 Angular2 作为前端。在后端，我添加了以下代码以在 WEB API 中启用 CORS。

 var corsAttr = new EnableCorsAttribute("*", "*", "*");
 config.EnableCors(corsAttr);

对于 Http get 请求一切正常，但对于 Http Post 请求则不一样。

任何帮助都将是可观的

提前致谢！

【问题讨论】：

标签： c# asp.net angular asp.net-web-api asp.net-web-api2

【解决方案1】：

我通过在 web.config 中添加以下行来解决它。

<system.webServer>
   <modules runAllManagedModulesForAllRequests="true">
   </modules>
</system.webServer>

谢谢。

【讨论】：

【解决方案2】：

在 Global.asax.cs 中的 Application_BeginRequest 期间为预检请求添加 Access-Control-Allow-Origin 标头对我有用。

Global.asax/Global.asax.cs

protected void Application_BeginRequest(Object sender, EventArgs e)
    {
        // Preflight request comes with HttpMethod OPTIONS
        if (HttpContext.Current.Request.HttpMethod == "OPTIONS")            
        {
            HttpContext.Current.Response.AddHeader("Cache-Control", "no-cache");
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST");               
            // The following line solves the error message
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
            // If any http headers are shown in preflight error in browser console add them below
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept, Pragma, Cache-Control, Authorization ");
            HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000");
            HttpContext.Current.Response.End();
        }
    }

解决此问题后，应用程序在浏览器控制台上抛出错误，即在预检响应中未提及某些标头。

一旦将标头添加到预检响应的 Access-Control-Allow-Headers 标头，它就会得到解决。

【讨论】：

谢谢，堆，在我的情况下，我只需要允许标头，因为使用 * 失败了！所以我只是将这个 <add name="Access-Control-Allow-Headers" value="Content-Type, Accept, Pragma, Cache-Control, Authorization " /> 添加到 web.config

【解决方案3】：

protected void Application_BeginRequest(Object sender, EventArgs e)
{
    // Preflight request comes with HttpMethod OPTIONS
        // The following line solves the error message
        HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
    if (HttpContext.Current.Request.HttpMethod == "OPTIONS")            
    {
        HttpContext.Current.Response.AddHeader("Cache-Control", "no-cache");
        HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST");               
        // If any http headers are shown in preflight error in browser console add them below
        HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept, Pragma, Cache-Control, Authorization ");
        HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000");
        HttpContext.Current.Response.End();
    }
}

上面的代码运行良好

【讨论】：