Angular调用ASP.NET Web API时Bearer Token无法被API接收

可能原因1：Angular拦截器未正确注册 #

你的拦截器代码逻辑没问题，但如果没在Angular模块中完成注册，它根本不会生效。打开app.module.ts，检查是否添加了拦截器的提供者配置：

import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { AuthenticationInterceptor } from './path-to-your-interceptor';

@NgModule({
  // ...其他模块配置
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: AuthenticationInterceptor,
      multi: true // 关键配置：允许多个拦截器共存
    }
  ]
})
export class AppModule { }

如果缺失这段配置，拦截器不会执行，你在浏览器调试中看到的请求头可能只是代码克隆后的模拟值，并非实际发送的请求内容。

可能原因2：CORS预检请求被拦截 #

浏览器发送POST请求前会自动发送OPTIONS预检请求，这个请求不会携带Authorization头。如果你的ASP.NET后端对OPTIONS请求也执行[Authorize]验证，就会直接返回401，导致后续的实际POST请求被浏览器拦截。

解决方法：跳过OPTIONS请求的Token验证 #

修改Startup.cs中JwtBearer的配置，添加事件处理逻辑跳过OPTIONS请求的验证：

.AddJwtBearer(x =>
{
    x.RequireHttpsMetadata = false;
    x.SaveToken = true;
    x.TokenValidationParameters = new TokenValidationParameters
    {
        ValidateIssuerSigningKey = true,
        IssuerSigningKey = new SymmetricSecurityKey(key),
        ValidateIssuer = false,
        ValidateAudience = false
    };
    // 新增：处理OPTIONS请求，直接返回200
    x.Events = new JwtBearerEvents
    {
        OnMessageReceived = context =>
        {
            if (context.Request.Method == HttpMethod.Options.Method)
            {
                context.Response.StatusCode = StatusCodes.Status200OK;
                return Task.CompletedTask;
            }
            return Task.CompletedTask;
        }
    };
});

你的现有CORS配置AllowAnyOrigin/Method/Header是正确的，且UseCors的调用顺序也没问题（在UseAuthentication之前），无需额外调整。

可能原因3：Token获取逻辑存在错误 #

检查AuthService.getToken()方法，确认它能从存储（如localStorage）中正确获取有效的Token。例如：

getToken(): string | null {
  return localStorage.getItem('authToken'); // 确保键名和登录时存储的完全一致
}

在拦截器中添加console.log(token)，确认Token不为空且是有效的JWT字符串。如果Token为空，请求头中的Bearer 后会是空值，后端自然会返回401。

可能原因4：后端Token的Claim配置问题 #

从控制器代码看，你通过User.FindFirst("user")?.Value获取用户邮箱，需确认生成Token时确实添加了user这个Claim。如果Token payload中没有该Claim，userEmail会为空，控制器会返回Forbid()，但你遇到的是401，所以这个大概率不是核心问题，但可以用JWT解析工具验证Token内容。

额外验证步骤 #

1. 在浏览器Network面板中，查看实际发送的POST请求（而非OPTIONS预检请求）的Request Headers，确认Authorization头确实存在且格式正确（Bearer xxxxxxx）。
2. 把浏览器中复制的Token直接放到Postman中测试，如果Postman能成功，说明Token本身有效，问题出在Angular的请求发送环节。

内容的提问来源于stack exchange，提问作者Rúben Santos