.NET Web API配置接口时Angular调用出现CORS跨域错误如何解决

修复步骤 #

1. 修正CORS配置冲突 #

你在两处配置了CORS规则导致冲突：

• 在ConfigureServices中你定义了默认CORS策略，仅放行http://localhost:4200的请求
• 在Configure方法中调用UseCors时又传入了匿名的全放行配置，覆盖了之前定义的默认策略，两边规则不统一导致失效。

只需要保留一套配置即可，推荐直接使用你定义好的默认策略，将Configure中的app.UseCors(...)代码替换为：

app.UseCors();

2. 补全认证中间件 #

你已经注册了JWT认证服务，但Configure方法中缺少对应的认证中间件，会导致带Authorization请求头的跨域预检请求直接失败，在UseCors之后、UseAuthorization之前添加认证中间件：

app.UseCors();
// 新增这行
app.UseAuthentication();
app.UseAuthorization();

3. 验证中间件顺序 #

确保最终中间件顺序和下方一致，顺序错误会直接导致CORS失效：

app.UseHttpsRedirection();
app.UseRouting();
// CORS必须放在Routing之后，认证授权之前
app.UseCors();
app.UseAuthentication();
app.UseAuthorization();
app.UseEndpoints(endpoints =>
{
    endpoints.MapControllers();
});

修改完成后重启API服务即可正常跨域访问。

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