Axios请求遇CORS拦截：如何处理Access-Control-Allow-Origin头问题？

你遇到的问题是：前端通过Axios请求ASP.NET后端接口时触发CORS错误，尽管后端配置了CORS策略，但预检请求（OPTIONS）仍未返回Access-Control-Allow-Origin头，导致浏览器拦截请求。

以下是具体解决方案：

1. 移除前端请求中的Access-Control-Allow-Origin头 #

Access-Control-Allow-Origin是后端返回给浏览器的响应头，前端请求中添加这个头没有意义，反而可能干扰预检请求逻辑。修改前端Axios代码，删除该冗余头：

const Subjects = async ({}) => {
    try {
        const { data, status } = await axios.get<GetSubjectResponse>(url, {
            headers: {
                'Content-Type': 'application/json',
            },
        });
        console.log("status is:", status);
        return data;
    } catch (error) {
        if (axios.isAxiosError(error)) {
            console.log('error message: ', error.message);
            return error.message;
        } else {
            console.log('unexpected error: ', error);
            return 'An unexpected error occurred';
        }
    }
};

2. 确保后端CORS中间件的注册顺序正确 #

ASP.NET Core中间件的执行顺序直接影响功能生效与否，UseCors必须放在**UseRouting之后，UseAuthorization之前**，否则CORS策略不会被应用到请求上。修改后端Program.cs的中间件顺序：

const string MyAllowSpecificOrigins = "_myAllowSpecificOrigins";

var builder = WebApplication.CreateBuilder(args);

// 注册CORS服务
builder.Services.AddCors(opt =>
{
    opt.AddPolicy(name: MyAllowSpecificOrigins, builder =>
    {
        builder.AllowAnyOrigin()
               .AllowAnyHeader()
               .AllowAnyMethod();
    });
});

// 注册控制器等其他服务
builder.Services.AddControllers();

var app = builder.Build();

// 中间件执行顺序：路由 → CORS → 授权 → 控制器映射
app.UseRouting();

// 启用CORS策略
app.UseCors(MyAllowSpecificOrigins);

app.UseAuthorization();

app.MapControllers();

app.Run();

3. 验证预检请求的响应 #

用Postman或curl发送OPTIONS请求到你的接口（https://5000-app.ws-us107.gitpod.io/api/Subject/Get/GetAll），检查响应头中是否包含Access-Control-Allow-Origin: *（或指定的域名）。如果存在，说明CORS配置已生效；如果不存在，重新检查中间件顺序和策略定义。

4. 生产环境的安全优化 #

开发环境使用AllowAnyOrigin()可以快速调试，但生产环境建议指定具体的前端域名，避免任意域名跨域访问：

builder.Services.AddCors(opt =>
{
    opt.AddPolicy(name: MyAllowSpecificOrigins, builder =>
    {
        builder.WithOrigins("https://3000-app.ws-us107.gitpod.io")
               .AllowAnyHeader()
               .AllowAnyMethod();
    });
});

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