2

I am building a .Net 5 Web API and I am having issues with CORS only when I am running locally (aka localhost). When I have deployed my app to Azure I can access my API just fine from my Blazor app.

Class Startup.cs

readonly string MyAllowSpecificOrigins = "_myAllowSpecificOrigins";

Class: Startup.cs
Method: ConfigureServices

services.AddCors(options =>
{
    //didn't work
    //options.AddDefaultPolicy(builder =>
    //{
    //    builder.SetIsOriginAllowed(origin => new Uri(origin).Host == "localhost");
    //});

    options.AddPolicy(name: MyAllowSpecificOrigins,
                      builder =>
                      {
                          builder.WithOrigins("https://localhost:44373/", "https://myawesomesite")
                          .AllowAnyMethod()
                          .AllowAnyHeader()
                          .AllowCredentials();
                      });
}); 

Class: Startup.cs
Method: Configure

app.UseCors(MyAllowSpecificOrigins);
Serge
  • 40,935
  • 4
  • 18
  • 45
Travis Pettry
  • 1,220
  • 1
  • 14
  • 35
  • Can you try without `WithOrigins`? – vernou Feb 08 '21 at 12:31
  • We had exactly the same problem with Angular App + WebAPI server. Don't remember the exact reason (I think something with ports in headers), therefore cannot post an answer. As a workaround we started Chrome with the Angular app from cmd with --disable-web-security --user-data-dir="c:/tmp/chrome" parameters. Than it won't care about CORS. – Maxim Zabolotskikh Feb 08 '21 at 12:31
  • How do you test your API locally? – vernou Feb 08 '21 at 12:32
  • This solution was working, then I worked the project from a different computer, once I merged back I have been getting CORS problems. – Travis Pettry Feb 08 '21 at 12:33
  • The one I have mentioned in the answer is working fine on my side and we are testing our API via POSTMAN and the from frontend as well using axios. – Bilal Mehrban Feb 08 '21 at 12:39
  • Just to be sure, Postman also throws CORS problem? – Maxim Zabolotskikh Feb 08 '21 at 12:41
  • Postman is working, but the Blazor app is not – Travis Pettry Feb 08 '21 at 12:48
  • 1
    Blazor runs in Browser, right? Postman does not care about CORS. Browser (AFAIK Chrome at least) does not support localhost as a valid origin, so it fails. See also here: https://stackoverflow.com/questions/10883211/deadly-cors-when-http-localhost-is-the-origin – Maxim Zabolotskikh Feb 08 '21 at 12:51

2 Answers2

8

Just remove trailing "/" from your local host url and for the test you can try to remove .AllowCredentials().

And use this syntax:

services.AddCors(o => o.AddPolicy(MyAllowSpecificOrigins,
                      builder =>
                      {
                          builder.WithOrigins("https://localhost:44373", 
                              "https://myawesomesite")
                          .AllowAnyMethod()
                          .AllowAnyHeader();
                      }));

and your UseCors method should be between UseRouting and UseAuthourization


app.UseRouting()
....
.....
app.UseCors(MyAllowSpecificOrigins);

....
....
app.UseAuthorization(); // if you need the one

spottedmahn
  • 14,823
  • 13
  • 108
  • 178
Serge
  • 40,935
  • 4
  • 18
  • 45
2

What I have on my side working properly as below.

Class: Startup.cs

Method: ConfigureServices

services.AddCors(c =>  
  { 
    c.AddPolicy("AllowOrigin", options => options.AllowAnyOrigin());  
  }); 

Class: Startup.cs

Method: Configure

app.UseCors(options => options.AllowAnyOrigin());

Try this, let me know if it helps.

Bilal Mehrban
  • 638
  • 6
  • 15