3

I have two applications running locally. One is an ASP.NET Core Web API (http://localhost:8081) serving up JSON responses. The other is a Javascript app (http://localhost:8080) making calls to the API. The API endpoint I'm testing with is a POST request and I've confirmed with Fiddler that this endpoint is working.

When I make the POST request from my Javascript app in Chrome I see this error:

Failed to load http://localhost:8081/api/search: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.

However, this is the full content of my API's Startup:

public Startup(IConfiguration configuration)
{
    Configuration = configuration;
}

public IConfiguration Configuration { get; }

public void ConfigureServices(IServiceCollection services)
{
    services
        .AddMvcCore()
        .AddJsonFormatters()
        .AddCors(options =>
        {
            options.AddPolicy("DefaultCorsPolicy",
                builder => builder
                    .WithOrigins("http://localhost:8080")
                    .AllowAnyMethod());
        });
}

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }

    app.UseCors("DefaultCorsPolicy");

    app.UseMvc();
}

I've followed the Microsoft docs, so I'm not sure what I've missed.

Here is the raw response I get from this endpoint in Fiddler:

HTTP/1.1 200 OK
Content-Type: application/json; charset=utf-8
Server: Kestrel
X-Powered-By: ASP.NET
Date: Sat, 10 Mar 2018 09:23:46 GMT
Content-Length: 37

[{"id":1,"name":"lorem ipsum dolor"}]

As you can see, no Access-Control-Allow-Origin header is present.

McGuireV10
  • 9,572
  • 5
  • 48
  • 64
Tom Troughton
  • 3,941
  • 2
  • 37
  • 77
  • Can you show us the response message when calling http://localhost:8081 ? – Orel Eraki Mar 10 '18 at 09:33
  • I've added to the end of my question. I've also re-ordered the `UseCors` and `UseMvc` statements after reading this (https://weblog.west-wind.com/posts/2016/Sep/26/ASPNET-Core-and-CORS-Gotchas), but this hasn't changed the behaviour. – Tom Troughton Mar 10 '18 at 09:38
  • Working well for me, try rebuilding the API solution. – Orel Eraki Mar 10 '18 at 10:12
  • @getsetcode try to add `.AllowAnyHeader()` as well – Set Mar 10 '18 at 10:52
  • @orel-eraki Thanks for checking. I've rebuilt many times with many variations of the configuration. I must be missing something but I can't imagine what. – Tom Troughton Mar 10 '18 at 11:27
  • @Set Thanks, but I've even tried with .AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader() and still no headers :( – Tom Troughton Mar 10 '18 at 11:27
  • This has suddenly started working. Can't explain why or how because the code is still as above. I did an iisreset but wasn't the first time I'd tried that. Wish I understood why it wasn't working before. – Tom Troughton Mar 10 '18 at 11:33
  • A similar problem: https://stackoverflow.com/questions/49900141/asp-net-core-cors-request-blocked-why-doesnt-my-api-apply-the-right-headers – Patrick Szalapski Apr 18 '18 at 13:18

1 Answers1

2

You can try to configure CORS options right in services.UseCors() call, rather than services.AddCors(). 

public void ConfigureServices(IServiceCollection services)
{
    services.AddCors();
    services.AddMvcCore();
    ...
}


public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    app.UseCors(builder => builder
        .WithOrigins("http://localhost:8000")
        .AllowAnyHeader()
        .AllowAnyMethod()
    );

    app.UseMvcCore();
    ...
}

Note: Test it by Clearing the client side cache if any. On Chrome > F12 > Network Tab > Tick Disable Cache check box > Refresh the page.

Nagesh Andani
  • 432
  • 6
  • 12