如何在Blazor Server端（ASP.NET Core）实现注销按钮？

后端配置（Program.cs） #

先确保项目已配置Cookie认证，再添加注销POST端点：

builder.Services.AddAuthentication(CookieAuthenticationDefaults.AuthenticationScheme)
    .AddCookie(options =>
    {
        options.LoginPath = "/login";
        options.LogoutPath = "/logout";
        // 按需添加其他Cookie配置，比如过期时间、路径等
    });

// ...

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

// 注册注销接口
app.MapPost("/logout", async (HttpContext context) =>
{
    // 清除认证Cookie
    await context.SignOutAsync(CookieAuthenticationDefaults.AuthenticationScheme);
    // 重定向到首页或登录页
    context.Response.Redirect("/");
});

前端MudBlazor按钮实现 #

在Blazor组件（比如布局组件Layout.razor）中添加注销按钮，通过HttpClient发送请求完成注销：

@inject HttpClient Http
@inject NavigationManager NavManager

<MudButton Color="Color.Error" OnClick="HandleLogout">注销</MudButton>

@code {
    private async Task HandleLogout()
    {
        // 发送POST请求触发注销
        await Http.PostAsync("/logout", null);
        // 强制刷新页面，清除Blazor状态缓存
        NavManager.NavigateTo("/", forceLoad: true);
    }
}

关键注意事项 #

• 必须用POST请求：GET请求注销存在CSRF风险，Cookie认证默认要求注销操作使用POST。
• 强制页面刷新：NavigateTo加上forceLoad: true，确保页面完全重新加载，避免Blazor客户端状态残留。
• CSRF令牌处理：如果项目启用了RequestVerificationToken（默认开启），需要在请求头中携带令牌，可修改HandleLogout方法：

private async Task HandleLogout()
{
    // 获取CSRF令牌
    var token = await Http.GetStringAsync("/_framework/requestverificationtoken");
    var request = new HttpRequestMessage(HttpMethod.Post, "/logout");
    request.Headers.Add("RequestVerificationToken", token);
    
    await Http.SendAsync(request);
    NavManager.NavigateTo("/", forceLoad: true);
}

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