How can I solve the CORS error in this C# code?

Question

I have CORS error in my .NETCore+React app. To solve that I've decided to add some configurations in my backend.

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

public IConfiguration Configuration { get; }

public void ConfigureServices(IServiceCollection services)
{
    services.AddCors(options =>
    {
        options.AddDefaultPolicy(builder => {
            builder.WithOrigins("http://127.0.0.1:3000/");
        });
    });
}

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    app.UseCors(x=> x
        .AllowAnyHeader().AllowAnyMethod().SetIsOriginAllowed(origin=>true).AllowCredentials()
    );
}

I wrote it on my Program.cs file. But i still have CORS error. Where did i go wrong? PS: I am using .NET 2.1

Does this answer your question? [How to enable CORS in ASP.NET Core](https://stackoverflow.com/questions/31942037/how-to-enable-cors-in-asp-net-core) — mamen, Jun 30 '21 at 09:39

score 0 · Accepted Answer · answered Jun 30 '21 at 09:40

This solved my issue with CORS

In ConfigureService method I used the below snippet to allow all origins

public void ConfigureServices(IServiceCollection services)
        {
            services.AddCors(options=>{
                options.AddPolicy("CorsPolicy",HostBuilder=>HostBuilder.AllowAnyOrigin().AllowAnyHeader().AllowAnyMethod());
            });
           }

In configure method just use

 app.UseCors("CorsPolicy");

sschwei1 · Answer 2 · 2021-07-01T09:42:09.100

You need to add the Any-Methods in your builder

public void ConfigureServices(IServiceCollection services)
{
    services.AddCors(options =>
    {
        options.AddDefaultPolicy(builder => {
            builder.AllowAnyHeader()
                   .AllowAnyMethod()
                   .AllowCredentials()
                   .WithOrigins("http://127.0.0.1:3000/");
        });
    });
}

In your Configure method you now only need to write

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    ...
    app.UseCors();
    ...
}

Keep in mind, this only allows cross origin requests from the specified origin, in this case http://127.0.0.1:3000, if you want to allow requests from anywhere, you can replace .WithOrigins(...) with .AllowAnyOrigin()

In case you don't want to override the default policy, you can also add a name

options.AddDefaultPolicy("MyPolicy", builder => {
    builder.AllowAnyHeader()
         .AllowAnyMethod()
         .AllowCredentials()
         .WithOrigins("http://127.0.0.1:3000/");
});

but now you would need to write

app.UseCors("MyPolicy");

You can apply this policy to your controller/actions with

[EnableCors("MyPolicy")]

yedajiang44 · Answer 3 · 2021-06-30T17:06:36.667

you can

add "proxy": "http://serverip:port" into package.jsonfile of react app
use nginx proxy your react app api
add code to Startup.cs of webapi

public void ConfigureServices(IServiceCollection services)
{
    services.AddCors(options => {
        options.AddPolicy("any", builder =>
        {
            builder.AllowAnyOrigin()
            .AllowAnyMethod()
            .AllowAnyHeader()
            .AllowCredentials();
        });
    });
}

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    app.UseCors("any");
}

I recommend the first method

How can I solve the CORS error in this C# code?

3 Answers3