Web Api 2 和 Angular 之间的 CORS 错误

Posted 2023-03-04

【中文标题】Web Api 2 和 Angular 之间的 CORS 错误

【英文标题】：CORS error between Web Api 2 & Angular

【发布时间】：2017-09-07 04:47:34

【问题描述】：

我有两台服务器：App 和 Web，App 托管由 OWIN 保护的 web api 2 API，Web 是调用 api 的 Angular 1.6 应用程序。

我的标题如下所示：

请求：

Host: app
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:52.0) Gecko/20100101 Firefox/52.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Access-Control-Request-Method: GET
Access-Control-Request-Headers: authorization
Origin: http://mysite
Connection: keep-alive

回复：

Access-Control-Allow-Headers: *
Access-Control-Allow-Methods: *
Access-Control-Allow-Origin: *
Allow: GET
Content-Length: 83
Content-Type: text/html; charset=utf-8
Date: Tue, 11 Apr 2017 16:41:04 GMT
Server: Microsoft-IIS/10.0
X-Powered-By: ASP.NET

我已经打开了我的 web.config 以包括：

<httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Origin" value="*" />
    <add name="Access-Control-Allow-Methods" value="*" />
    <add name="Access-Control-Allow-Headers" value="*" />
  </customHeaders>
</httpProtocol>

我也有：

config.EnableCors(new EnableCorsAttribute("*", "*", "*"));

我的错误是：

原因：CORS 标头“Access-Control-Allow-Origin”与“(null)”不匹配

我在这里遗漏了什么以及如何使 CORS 错误消失？

【问题讨论】：

在您的服务器上尝试更改对此的响应，看看它是否有效。 Access-Control-Allow-Headers：Content-Type，Access-Control-Allow-Methods：GET、POST、OPTIONS Access-Control-Allow-Origin：*。我认为星号可以全面发挥作用，但也许它会引起问题。

你应该弄清楚为什么浏览器决定源是'null'而不是你说你在请求头中看到的http://mysite源。 ***.com/questions/42239643/… 列出了浏览器将确定来源为“空”的一些情况。我想在这种情况下最有可能发生的情况是在两者之间发生了一些跨域重定向

【参考方案1】：

当然，在发布问题后不久，我就明白了：我的问题有两个方面：

我需要删除

config.EnableCors(new EnableCorsAttribute("*", "*", "*"));

来自 WebApiConfig.cs

然后在 Startup.cs 中

我需要搬家

app.UseCors(CorsOptions.AllowAll);

到顶部。

此时 web.config 部分也已安全删除。

归功于：Dreaded CORS issue with WebAPI and token