Question

我在Asp.net上调用REST Web API时遇到以下错误。

XMLHttpRequest无法加载http://localhost:54859/api/PostData。对预检请求的响应没有通过访问控制检查：否＆＃39;访问控制 - 允许 - 来源＆＃39;标头出现在请求的资源上。起源＆＃39; http://localhost:3000＆＃39;因此不允许访问。

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

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

一切都适用于Http get请求，但同样不适用于Http Post请求。

任何帮助都会很明显

提前致谢！

Answer 1

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

"images": [ {
  "latitude": 40.3951,
  "longitude": -73.5619,
  "type": "circle",
  "scale": 10,
  "color": "#6c00ff"
},{
  "latitude": 40.3951,
  "longitude": -73.5619,
  "type": "circle",
  "scale": 8,
  "color": "#6cff00"
},{
  "latitude": 30.3951,
  "longitude": -60.5619,
  "type": "hexagon",
  "scale": 10,
  "color": "#ff006c"
},{
  "latitude": 30.3951,
  "longitude": -60.5619,
  "type": "hexagon",
  "scale": 8,
  "color": "#00ff6c"
} ]

感谢。

Answer 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标题后，它就会得到解决。

Answer 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();
    }
}

以上代码工作正常

对预检请求的响应没有通过访问控制检查（Angular2）

3 个答案: