CORS errors on PUT request between Angular 4 app and MVC WebAPI

Question

I am trying to figure out what is causing the issues between my angular applications and MVC web API application.

In my webapiconfig.cs I am enabling CORS as follows:

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

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

I am performing the PUT request using something like:

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

I'm not really sure if this matters but in my requests I am sometimes returning different status codes based on the error.

Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://localhost:4200' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

I am getting back a successful response but in the response headers, I do not see any CORS headers:

    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>

Any suggestion on what should I do to get this working?

FussinHussin · Accepted Answer · 2017-10-02 17:54:00Z

1

Response should only have the accepted headers in Access-Control-Allow-Headers, don't use wildcard. There are security concerns to this, and that's why you are getting the error.

refer to the answer in this post for more information on why this is a bad practice. It is an angular.js post, but the CORS aspect applies

answered Oct 2, 2017 at 17:54

FussinHussin

1,8245 gold badges21 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

AlexanderM Over a year ago

The reason I have a wildcards over there is b/c otherwise I am getting error: Server cannot set status after HTTP headers have been sent.

AlexanderM Over a year ago

Btw, from the documentation attached to one of the answers I see only concern for Origins, now Headers. Either way the problem here is that response headers does not have any headers at all even everything is specified according to ms documentation (or I am missing something).

FussinHussin Over a year ago

alright, hmmm. well that can't be right, could you post more of your code maybe? have you had a look at this post, stackoverflow.com/questions/29709477/…

AlexanderM Over a year ago

Never mind, I just find it out: when we setup this API for the 1st time for whatever reason there was a code to flush headers on options request (person who set it up doesn't remember why).For whatever reason it doesn't duplicate headers for get but does for post and put. I ust happened to write very 1st Put request for that API. I removed that code and sees to be good now. While the post wasn't right it made my thoughts flow in the right direction.

FussinHussin Over a year ago

glad you figured it out

Zvi Redler · Accepted Answer · 2019-08-15 10:02:34Z

0

Search your code, maybe you add the header twice, that what was happend to me...

We did

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

And in another place:

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

answered Aug 15, 2019 at 10:02

Zvi Redler

1,7781 gold badge19 silver badges31 bronze badges

Collectives™ on Stack Overflow

CORS errors on PUT request between Angular 4 app and MVC WebAPI

2 Answers 2

5 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related