跨端口请求时Set-Cookie已存在但浏览器未设置Cookie问题

核心问题分析 #

跨端口（https://localhost:7026前端 → https://localhost:5000后端）属于跨域请求，浏览器对跨域Cookie的设置和携带有严格规则，你的配置存在三个关键遗漏：

1. CORS中间件顺序错误，导致响应头未正确注入
2. Cookie未配置跨域必需的SameSite=None规则
3. Blazor WASM请求未携带认证凭证标记

解决方案步骤 #

1. 修正CORS中间件顺序 #

将UseCors移至UseRouting之后、UseAuthentication之前，确保CORS响应头在认证逻辑之前被添加：

app.UseRouting();

// 调整到此处，保证CORS优先处理跨域请求头
app.UseCors();

app.UseAuthentication();
app.UseAuthorization();

// 后续中间件逻辑...

2. 更新Cookie配置 #

添加SameSite=None和Secure=true（SameSite=None要求Cookie必须是Secure的，你的HTTPS环境满足条件），同时不要手动设置Cookie.Domain（localhost域名下手动指定Domain会干扰浏览器的Cookie匹配逻辑）：

builder.Services.ConfigureApplicationCookie(options =>
{
    options.Cookie.HttpOnly = true;
    options.Cookie.IsEssential = true;
    options.Cookie.Secure = CookieSecurePolicy.Always; // 强制使用Secure Cookie
    options.Cookie.SameSite = SameSiteMode.None; // 跨域场景必需配置
    options.ExpireTimeSpan = TimeSpan.FromDays(5);
    options.ReturnUrlParameter = CookieAuthenticationDefaults.ReturnUrlParameter;
    options.SlidingExpiration = true;

    options.Events = new CookieAuthenticationEvents
    {
        OnRedirectToLogin = context =>
        {
            if (context.Request.Path.StartsWithSegments("/api"))
            {
                context.Response.StatusCode = (int)HttpStatusCode.Unauthorized;
            }
            return Task.CompletedTask;
        }
    };
});

3. 配置Blazor WASM请求携带凭证 #

在Blazor项目的Program.cs中，注册HttpClient时开启自动携带Cookie的配置：

builder.Services.AddScoped(sp =>
{
    var handler = new HttpClientHandler
    {
        UseCookies = true, // 自动处理Cookie的发送与接收
        AllowAutoRedirect = false
    };
    var client = new HttpClient(handler)
    {
        BaseAddress = new Uri("https://localhost:5000/")
    };
    return client;
});

如果使用JS互操作调用Fetch API，需要在请求中显式添加凭证标记：

fetch('https://localhost:5000/api/login', {
    method: 'POST',
    credentials: 'include', // 强制携带Cookie
    body: JSON.stringify(loginModel),
    headers: {
        'Content-Type': 'application/json'
    }
});

4. 验证浏览器Cookie状态 #

登录后打开浏览器开发者工具（F12），在Application标签的Cookies → https://localhost下查看是否存在认证Cookie，同时检查控制台是否有Cookie相关警告（比如SameSite或Secure规则不匹配的提示）。

内容的提问来源于stack exchange，提问作者Stefan Grasböck