Blazor Server经OpenID（Keycloak）认证后WebSocket连接失败求助

1. 确认SignalR的认证策略配置 #

Blazor Server依赖SignalR实现双向通信，登录后WebSocket连接需要携带认证凭据，需显式配置授权规则：

// Program.cs中配置Blazor Hub的授权策略
app.MapBlazorHub(options =>
{
    options.AuthorizationPolicy = "Authenticated";
});

// 确保已添加授权服务
builder.Services.AddAuthorization();

2. 检查Cookie的SameSite与Secure属性 #

登录后Cookie无法被WebSocket请求携带是常见问题，需调整Cookie配置适配跨域或反向代理场景：

// Program.cs中配置应用Cookie
builder.Services.ConfigureApplicationCookie(options =>
{
    // 根据实际场景选择Lax/None，HTTPS环境下建议开启Secure
    options.Cookie.SameSite = SameSiteMode.Lax;
    options.Cookie.SecurePolicy = CookieSecurePolicy.Always;
});

同时检查Keycloak端的Cookie设置，确保其SameSite属性与Blazor应用兼容。

3. 配置反向代理转发头 #

Docker环境下，Blazor应用需要正确识别Nginx转发的请求协议与地址，否则SignalR可能错误使用HTTP建立连接：

// Program.cs中添加转发头处理
app.UseForwardedHeaders(new ForwardedHeadersOptions
{
    ForwardedHeaders = ForwardedHeaders.XForwardedFor | ForwardedHeaders.XForwardedProto
});

4. 适配JWT认证与SignalR的结合 #

如果使用JWT而非Cookie认证，需要让SignalR支持从请求中获取JWT：

// Program.cs中配置JWTBearer认证
builder.Services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
    .AddJwtBearer(options =>
    {
        options.Authority = "https://your-keycloak-url/auth/realms/your-realm";
        options.Audience = "your-audience";
        options.Events = new JwtBearerEvents
        {
            OnMessageReceived = context =>
            {
                // 从查询参数提取JWT，适配SignalR的WebSocket请求
                var accessToken = context.Request.Query["access_token"];
                var path = context.HttpContext.Request.Path;
                if (!string.IsNullOrEmpty(accessToken) && path.StartsWithSegments("/_blazor"))
                {
                    context.Token = accessToken;
                }
                return Task.CompletedTask;
            }
        };
    });

// 确保Blazor Hub要求授权
app.MapBlazorHub().RequireAuthorization();

前端需在建立SignalR连接时主动携带JWT：

@inject IAccessTokenProvider TokenProvider
@inject NavigationManager NavigationManager

@code {
    protected override async Task OnInitializedAsync()
    {
        var tokenResult = await TokenProvider.RequestAccessToken();
        if (tokenResult.TryGetToken(out var token))
        {
            var hubConnection = new HubConnectionBuilder()
                .WithUrl(NavigationManager.ToAbsoluteUri("/_blazor"), options =>
                {
                    options.AccessTokenProvider = () => Task.FromResult(token.Value);
                })
                .Build();
            // 执行连接逻辑
        }
    }
}

5. 验证Docker网络连通性 #

• 确保Nginx容器与Blazor容器处于同一个Docker网络，端口映射正确，WebSocket请求能转发到Blazor容器的应用端口。
• 检查容器间的防火墙规则，避免阻止WebSocket的双向通信。

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