1

Using: Angular 7, .net core, web api

I recently changed my application to use windows authentication and now my once working requests are failing for any post and put (get works). I am getting a 

Access to XMLHttpRequest at 'https://localhost:44372/api/tasks' from 
origin 'http://localhost:4200' has been blocked by CORS policy: Response 
to preflight request doesn't pass access control check: No 'Access- 
Control-Allow-Origin' header is present on the requested resource.

I had to add an angular interceptor to get the get requests to work with windows authentication enabled.

@Injectable()
export class CredentialsInterceptor implements HttpInterceptor {

intercept(request: HttpRequest<any>, next: HttpHandler): 
Observable<HttpEvent<any>> {
    request = request.clone({
        withCredentials: true
    });
    return next.handle(request);
  }
}

My startup.cs is adding CORS like this (I have to setIsOriginAllowed for the get requests to work)

services.AddCors(o => o.AddPolicy("AllowAll", builder =>
        {
            builder.SetIsOriginAllowed((host) => true)
                   .AllowAnyMethod()
                   .AllowAnyHeader()
                   .AllowCredentials();
        }));

...//Configure
app.UseCors("AllowAll");
app.UseMvc(routes =>
{
    ...

I've also tried specifying the origins or methods .WithOrigins("https://localhost:4200", "http://localhost:4200") or .AllowAnyOrigin()

As well as adding the header manually while in the interceptor

intercept(request: HttpRequest<any>, next: HttpHandler): 
Observable<HttpEvent<any>> {
    request = request.clone({
        withCredentials: true
    });
    request.headers.append('Access-Control-Allow-Origin', 'http://localhost:4200');
    return next.handle(request);

What am I missing? I've been googling for hours. I understand that CORS is blocked if the allowed origin isn't specified. Other StackOverflows are saying that it can't be the client side but I feel that the client request is not sending the 'Access-Control-Allow-Origin' header. How can I test to make sure that header is set? Why would Get work and not Put requests?

ModestMonk
  • 402
  • 1
  • 7
  • 16
  • What’s the HTTP status code of the response? You can use the Network pane in browser devtools to check. Is it a 4xx or 5xx error rather than a 200 OK success response? – sideshowbarker Jul 11 '19 at 21:24
  • It's 401 unauthorized – ModestMonk Jul 11 '19 at 22:31
  • Yeah so that 401 unauthorized error is the problem you need to fix. See the answer at https://stackoverflow.com/a/45406085/441757 for a detailed explanation of what’s going on there as far as the CORS protocol goes. To fix is you, you need to change your server-side code to allow unauthenticated OPTIONS requests. – sideshowbarker Jul 12 '19 at 01:02

2 Answers2

0

All the other posts stated what the issue was but not what the solution to the issue was. The OPTIONS request is being placed without authorization headers in place. I am able to make the GET request because the windows authentication headers are passed along but when I make a PUT request, an OPTIONS must first be sent out that doesn't contain the header.

In order for the server to allow the OPTIONS I had to allow anonymous authentication for the OPTIONS. I did that by selecting it in the project properties -> debug section.

ModestMonk
  • 402
  • 1
  • 7
  • 16
-1

The server has to set the header in its response. Setting it in the request from the client of no use. Try making a request to the api endpoint using a tool like postman and see what headers are being set by the server in the response.

Most likely there is a problem in the server side code that is causing this issue.

Sunay Gandhi
  • 36
  • 3