Blazor HttpClient 附加 JWT Token 的方法

来源：这里教程网时间：2026-02-21 17:33:27 作者：

在 Blazor（尤其是 Blazor WebAssembly）中，为

HttpClient

自动附加 JWT Token 最常用、最推荐的方式是使用自定义
DelegatingHandler
，配合

IJSRuntime

读取本地存储的 token（如 localStorage），再注入到每个请求的 Authorization 头中。

1. 创建带 Token 的 HttpClient Handler

新建一个继承自

DelegatingHandler

的类，例如

AuthorizationMessageHandler

：

public class AuthorizationMessageHandler : DelegatingHandler
{
    private readonly IJSRuntime _jsRuntime;
    public AuthorizationMessageHandler(IJSRuntime jsRuntime)
    {
        _jsRuntime = jsRuntime;
    }
    protected override async Task<HttpResponseMessage> SendAsync(
        HttpRequestMessage request, CancellationToken cancellationToken)
    {
        var token = await _jsRuntime.InvokeAsync<string>("localStorage.getItem", "authToken");
        if (!string.IsNullOrEmpty(token))
        {
            request.Headers.Authorization = new AuthenticationHeaderValue("Bearer", token);
        }
        return await base.SendAsync(request, cancellationToken);
    }
}

这个 handler 会在每次 HTTP 请求发出前，从浏览器 localStorage 中读取 token 并添加到请求头。

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

在 Blazor WebAssembly 的

Program.cs

中，注册该 handler，并将其注入到命名的

HttpClient

：

builder.Services.AddScoped<AuthorizationMessageHandler>();
builder.Services.AddHttpClient<IApiService, ApiService>()
    .AddHttpMessageHandler<AuthorizationMessageHandler>()
    .ConfigureHttpClient(client =>
    {
        client.BaseAddress = new Uri(builder.HostEnvironment.BaseAddress);
    });

注意：不要直接注册无名的

HttpClient

（如

AddHttpClient<httpclient></httpclient>

），否则可能干扰框架默认客户端；推荐为 API 服务创建专用接口+实现，或使用命名客户端。

3. Token 存储与刷新时机要匹配

确保 token 已正确存入 localStorage，且在登录成功后及时写入：

登录成功后调用 JS：
await jsRuntime.InvokeVoidAsync("localStorage.setItem", "authToken", token);
登出时务必清除：
await jsRuntime.InvokeVoidAsync("localStorage.removeItem", "authToken");
若 token 有过期时间，可在
AuthorizationMessageHandler
中加一层校验（比如解析 JWT payload 判断 exp），但更推荐由上层逻辑统一管理 token 刷新流程