ASP.NET Core后端API对接React前端遇CORS错误求助

你遇到的CORS错误信息：

"Access to fetch at 'https://example.com/api/data' from origin 'https://medvent.azurewebsites.net' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource."

结合你的代码和部署环境，以下是具体的排查与解决步骤：

一、优先检查Azure App Service平台级CORS配置（关键！） #

由于你的后端托管在Azure App Service，平台自带的CORS配置会覆盖代码中的策略：

• 登录Azure门户，找到你的App Service实例
• 进入「API」→「CORS」选项卡
• 如果此处已配置源列表，会优先生效；若要使用代码中的配置，可将此处设置为「允许所有来源」（*）或清空列表

二、修正配置冲突与中间件顺序 #

1. AllowCredentials与AllowAnyOrigin的冲突
   当你启用AllowCredentials()时，绝对不能搭配AllowAnyOrigin()——浏览器禁止同时返回Access-Control-Allow-Origin: *和Access-Control-Allow-Credentials: true，这会直接导致CORS头无法生成。你当前代码中指定具体源的方式是正确的，无需修改这部分。

2. 确认中间件顺序合规性
   你的代码中UseCors的位置是正确的，但需牢记：

   • UseCors必须放在UseAuthorization和MapControllers之前
   • UseCors必须放在UseRouting之后（适配端点路由模式）
     后续新增中间件时，不要打乱这个顺序。

三、验证请求源的精确匹配 #

• 确认前端发起请求的源确实是https://medvent.azurewebsites.net（注意：必须包含https，域名拼写完全一致，不能带非标准端口，除非前端确实使用了特殊端口）
• 若本地开发时前端用了其他端口（比如http://localhost:3000），需在CORS策略中添加对应源

四、检查预检请求（OPTIONS）响应 #

打开浏览器开发者工具（F12）→「网络」标签，找到对应请求的OPTIONS预检请求：

• 查看响应头是否包含Access-Control-Allow-Origin、Access-Control-Allow-Methods等CORS相关字段
• 若OPTIONS请求返回404或错误码，说明路由配置或其他中间件拦截了预检请求

五、排查其他拦截因素 #

• 检查是否有自定义中间件在CORS中间件之前就终止了请求（比如异常处理中间件直接返回错误，未让请求流转到CORS逻辑）
• 确认HTTPS配置：后端强制HTTPS时，前端请求必须使用HTTPS，否则会触发跨域失败

针对当前代码的优化建议 #

如果以上排查后仍未解决，可尝试更灵活的源匹配方式：

var MyAllowSpecificOrigins = "_myAllowSpecificOrigins";
var builder = WebApplication.CreateBuilder(args);
builder.Services.AddCors(options =>
{
    options.AddPolicy(name: MyAllowSpecificOrigins, builder =>
    {
        builder.SetIsOriginAllowed(origin => 
                origin.Equals("https://medvent.azurewebsites.net", StringComparison.OrdinalIgnoreCase))
               .AllowAnyMethod()
               .AllowAnyHeader()
               .AllowCredentials();
    });
});
var app = builder.Build();
// 其余中间件顺序保持不变
app.UseSwagger();
if (app.Environment.IsDevelopment())
{
    app.UseSwaggerUI();
}
app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseRouting();
app.UseCors(MyAllowSpecificOrigins);
app.UseAuthorization();
app.UseSession();
app.MapControllers();
app.Run();

内容的提问来源于stack exchange，提问作者kevin pomerantz