如何解决此 C# 代码中的 CORS 错误？答案

【问题标题】：How can I solve the CORS error in this C# code?如何解决此 C# 代码中的 CORS 错误？
【发布时间】：2021-09-12 11:02:52
【问题描述】：

我的 .NETCore+React 应用程序出现 CORS 错误。为了解决这个问题，我决定在我的后端添加一些配置。

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()
    );
}

我将它写在我的 Program.cs 文件中。但我仍然有CORS错误。我哪里做错了？ PS：我使用的是 .NET 2.1

【问题讨论】：

这能回答你的问题吗？ How to enable CORS in ASP.NET Core

标签： c# reactjs .net cors

【解决方案1】：

您需要在构建器中添加 Any-Methods

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

在您的Configure 方法中，您现在只需要编写

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

记住，这只允许来自指定源的跨域请求，在这种情况下http://127.0.0.1:3000，如果你想允许来自任何地方的请求，你可以将.WithOrigins(...)替换为.AllowAnyOrigin()

如果您不想覆盖默认策略，也可以添加名称

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

但现在你需要写

app.UseCors("MyPolicy");

您可以将此策略应用于您的控制器/操作

[EnableCors("MyPolicy")]

【讨论】：

【解决方案2】：

你可以

将"proxy": "http://serverip:port"添加到react应用的package.json文件中
使用 nginx 代理你的 react 应用 api
将代码添加到webapi的Startup.cs

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");
}

我推荐第一种方法

【讨论】：

【解决方案3】：

这解决了我的 CORS 问题

在 ConfigureService 方法中，我使用下面的 sn-p 来允许所有来源

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

在配置方法中只需使用

 app.UseCors("CorsPolicy");

【讨论】：