Question

我试图找出导致我的角度应用程序和MVC Web API应用程序之间出现问题的原因。

在我webapiconfig.cs我启用CORS如下：

var corsAttr = new EnableCorsAttribute("http://localhost:4200,http://domain1,http://domain2", "*", "*");
corsAttr.SupportsCredentials = true;

// Enable CORS Globally 
config.EnableCors(corsAttr);

我正在使用以下内容执行PUT请求：

updateExchange(exchange: IOrder): Observable<IOrder> {
  return this._http.put<IOrder>(this._orderServiceUrl + '/' + order.Id, order)
    .do(this.handleSuccessResponse)
    .catch(this.handleErrorResponse);
}

我不确定这是否重要，但在我的请求中，我有时会根据错误返回不同的状态代码。

对预检请求的响应未通过访问控制检查：响应中'Access-Control-Allow-Origin'标头的值必须为当请求的凭据模式为时，不是通配符'*' '包括'。因此不允许来源“http://localhost:4200” 访问。由...发起的请求的凭据模式 XMLHttpRequest由withCredentials属性控制。

我收到了成功的响应，但在响应标头中，我没有看到任何CORS标头：

    Cache-Control:private
    Date:Mon, 02 Oct 2017 15:37:31 GMT
    Server:Microsoft-IIS/10.0
    Transfer-Encoding:chunked
    X-AspNet-Version:4.0.30319
    X-Powered-By:ASP.NET
    X-SourceFiles:=?UTF-8?<something>

有关我应该怎样做才能使其正常工作的任何建议？

Answer 1

响应应该只有Access-Control-Allow-Headers中的接受标头，不要使用通配符。对此存在安全问题，这就是您收到错误的原因。

请参阅this post中的答案，了解有关为什么这是一种不良做法的更多信息。它是一个angular.js帖子，但CORS方面适用

Answer 2

搜索您的代码，也许您添加标题两次，以了解发生在我身上的事...

我们做到了

var corsAttr = new EnableCorsAttribute("http://localhost:4200,http://domain1,http://domain2", "*", "*");
corsAttr.SupportsCredentials = true;
config.EnableCors(corsAttr);

在另一个地方：

        With filterContext.RequestContext.HttpContext.Response
            .AddHeader("Access-Control-Allow-Origin", "*");
            .AddHeader("Access-Control-Allow-Methods", "*");
            .AddHeader("Access-Control-Allow-Headers", "*");
        End With

Angular 4 app和MVC WebAPI之间的PUT请求的CORS错误

2 个答案: