Blazor Web App .NET 8：WASM组件获取AccessToken传递给SignalR端点

核心思路 #

在Blazor WASM中，官方推荐通过IAccessTokenProvider接口安全获取AccessToken，而非依赖服务器端的HttpContext或自定义存储。该接口由Microsoft.AspNetCore.Components.WebAssembly.Authentication包提供，专门用于客户端身份令牌的管理，且能自动适配SignalR的WebSocket场景（框架会自动将令牌附加到查询字符串）。

具体实现步骤 #

1. 注入必要服务
   在Razor组件顶部注入IAccessTokenProvider和NavigationManager：

@inject IAccessTokenProvider TokenProvider
@inject NavigationManager Navigation

2. 重构HubConnection构建代码
   利用IAccessTokenProvider动态获取令牌，替换硬编码的signalRToken：

hubConnection = new HubConnectionBuilder()
    .WithUrl(Navigation.ToAbsoluteUri("https://localhost:7288/chathub"), options =>
    {
        options.AccessTokenProvider = async () =>
        {
            // 请求获取AccessToken
            var tokenResult = await TokenProvider.RequestAccessTokenAsync();
            
            if (tokenResult.TryGetToken(out var token))
            {
                return token.Value;
            }
            
            // 令牌获取失败时，跳转到登录页
            Navigation.NavigateToLogin("");
            return null;
        };
        
        // 保留原有的自定义Header配置
        options.Headers.Add("BusinessId", MapInitialization!.BusinessId!.Value!.ToString());
        options.Headers.Add("BusinessRole", MapInitialization?.SignalRRole!);
        options.Headers.Add("DisplayName", MapInitialization?.SignalRDisplayName!);
        options.Headers.Add("UserName", MapInitialization?.SignalRUserName!);               
    })
    .Build();

3. 确保项目依赖与配置

• 确认项目已安装Microsoft.AspNetCore.Components.WebAssembly.Authentication NuGet包；
• 在Program.cs中已正确配置身份验证服务（以OIDC为例）：

builder.Services.AddOidcAuthentication(options =>
{
    // 配置你的身份提供者信息（如Authority、ClientId等）
    builder.Configuration.Bind("Auth0", options.ProviderOptions);
});

为何之前的尝试无效 #

• IHttpContextAccessor不适用WASM：WASM客户端运行在浏览器中，不存在服务器端的HttpContext，因此该接口无法获取任何有效信息；
• OnSignedIn回调的局限性：该回调在服务器端执行，HttpContext.Items仅在当前请求生命周期内有效，无法持久化或传递到客户端WASM应用中。

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