Blazor WebAssembly中通过中间件为HttpClient添加请求头Token

首先需要说明：你当前编写的AddTokenMiddleware是ASP.NET Core服务端的中间件（基于RequestDelegate），但你的项目是Blazor WebAssembly客户端，这类服务端中间件无法作用于客户端的HttpClient。客户端需要使用**DelegatingHandler**来拦截请求并添加Token。

具体实现步骤 #

1. 重构Token拦截逻辑为DelegatingHandler #

替换原有中间件代码，编写继承自DelegatingHandler的拦截器类：

public class AddTokenHandler : DelegatingHandler
{
    private readonly ILocalStorage _localStorage;

    public AddTokenHandler(ILocalStorage localStorage)
    {
        _localStorage = localStorage;
    }

    protected override async Task<HttpResponseMessage> SendAsync(
        HttpRequestMessage request, CancellationToken cancellationToken)
    {
        // 异步获取本地存储的Token
        var accessToken = await _localStorage.GetStringAsync("token");

        if (!string.IsNullOrEmpty(accessToken))
        {
            // 将Token添加到Authorization请求头，采用Bearer认证格式
            request.Headers.Authorization = new System.Net.Http.Headers.AuthenticationHeaderValue("Bearer", accessToken);
        }

        // 继续执行请求流程
        return await base.SendAsync(request, cancellationToken);
    }
}

2. 在Program.cs中注册Handler并配置HttpClient #

修改Program.cs里的HttpClient注册逻辑，将拦截器关联到HttpClient：

public static async Task Main(string[] args)
{
    var builder = WebAssemblyHostBuilder.CreateDefault(args);
    builder.RootComponents.Add<App>("#app");
    builder.RootComponents.Add<HeadOutlet>("head::after");

    // 注册AddTokenHandler为Scoped服务
    builder.Services.AddScoped<AddTokenHandler>();

    // 注册带Token拦截功能的HttpClient
    builder.Services.AddScoped(sp =>
    {
        var tokenHandler = sp.GetRequiredService<AddTokenHandler>();
        // 设置内层处理程序为默认的HttpClientHandler
        tokenHandler.InnerHandler = new HttpClientHandler();
        
        return new HttpClient(tokenHandler)
        {
            BaseAddress = new Uri("https://localhost:7014")
        };
    });

    builder.Services.AddSingleton<ILocalStorage, LocalStorage>();

    await builder.Build().RunAsync();
}

针对你的疑问的解答 #

问题1：如何将中间件添加到Program.cs？ #

Blazor WASM客户端不适用服务端的RequestDelegate中间件，我们改用DelegatingHandler实现请求拦截：

• 先将AddTokenHandler注册为Scoped服务
• 在注册HttpClient时，实例化该Handler并设置为HttpClient的处理程序，同时指定内层处理程序为默认的HttpClientHandler

问题2：如何将accessToken添加到HttpClient的请求头中？ #

在AddTokenHandler的SendAsync方法中完成：

1. 使用await异步获取本地存储的Token（注意GetStringAsync是异步方法，必须等待执行完成）
2. 如果Token不为空，给请求的Authorization头添加Bearer {token}格式的认证信息
3. 调用base.SendAsync继续执行后续请求流程

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