Blazor Web App接口鉴权Cookie未在浏览器响应头出现问题排查

核心问题原因 #

浏览器在跨域AJAX请求中默认会限制Cookie的发送与存储，同时你的现有配置存在两个关键冲突：

1. CORS配置中AllowAnyOrigin与AllowCredentials不兼容，浏览器会因安全策略拒绝处理Cookie
2. Cookie的SameSite=Strict设置会阻止跨域AJAX请求中的Cookie操作

分步解决方案 #

1. 调整前端请求凭证配置

调用Minimal API时必须明确携带凭证：

• 若使用Blazor的HttpClient，在DI注册或实例化时开启Cookie支持：

// 在Program.cs中注册带凭证的HttpClient
builder.Services.AddHttpClient("AuthApiClient", client =>
{
    client.BaseAddress = new Uri(builder.Configuration["ApiBaseUrl"]);
})
.ConfigurePrimaryHttpMessageHandler(() => new HttpClientHandler
{
    UseCookies = true,
    AutomaticDecompression = DecompressionMethods.GZip | DecompressionMethods.Deflate
});

• 若使用JS Interop的Fetch API，需添加credentials: 'include'：

fetch('/api/account/login', {
    method: 'POST',
    credentials: 'include',
    body: JSON.stringify({ email: 'xxx', password: 'xxx' }),
    headers: { 'Content-Type': 'application/json' }
});

2. 修正CORS配置

替换AllowAnyOrigin为具体允许的前端域名，并开启凭证支持：

services.AddCors(options =>
{
    options.AddPolicy("AllowAuthOrigins", corsPolicyBuilder =>
        corsPolicyBuilder.WithOrigins("https://your-blazor-domain.com") // 替换为实际前端地址
            .AllowAnyMethod()
            .AllowAnyHeader()
            .AllowCredentials()); // 关键：允许跨域携带凭证
});

var app = builder.Build();
app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseCors("AllowAuthOrigins"); // 确保在认证中间件前执行
app.UseAuthentication();
app.UseAuthorization();

注意：AllowAnyOrigin和AllowCredentials不能同时使用，浏览器会直接拒绝此类不安全配置。

3. 调整Cookie的SameSite策略

根据场景修改SameSite设置：

• 跨域场景（前端与API域名不同）：

builder.Services.AddAuthentication(CookieAuthenticationDefaults.AuthenticationScheme)
    .AddCookie(options =>
    {
        // 保留原有其他配置
        options.Cookie.SameSite = SameSiteMode.None;
        options.Cookie.SecurePolicy = CookieSecurePolicy.Always; // None模式必须配合HTTPS
    });

• 同域AJAX场景：

options.Cookie.SameSite = SameSiteMode.Lax;

4. 验证中间件顺序

确保UseCors在UseAuthentication、UseAuthorization之前执行，你的现有配置已符合要求，但需确认无其他中间件干扰。

内容的提问来源于stack exchange，提问作者E-Bat