首先,我们需要通过 nuget 包管理器或命令行安装 Microsoft.AspNetCore.Components.WebAssembly.Authentication 包,以便在 Blazor WASM 中实现身份验证。
接下来,我们需要在 Blazor WASM 项目的 Startup.cs 文件中添加自定义身份验证服务的配置。这可以通过调用 AddJwtBearer 方法来完成:
public void ConfigureServices(IServiceCollection services)
{
    services.AddAuthentication(options =>
      {
          options.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme;
          options.DefaultChallengeScheme = JwtBearerDefaults.AuthenticationScheme;
      })
      .AddJwtBearer(options =>
      {
          options.Authority = "https://your-auth-server.com";
          options.Audience = "your-audience-id"; // Could be a list of audiences
      });
    
    // Other configurations...
}
在上面的代码中,我们将 Blazor WASM 应用程序配置为使用 JWT 身份验证,并定义了要使用的 Authority 和 Audience。
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    // Other configurations...
    
    app.UseAuthentication();
    app.UseAuthorization();
    app.UseEndpoints(endpoints =>
    {
        endpoints.MapControllers();
        endpoints.MapBlazorHub();
        endpoints.MapFallbackToPage("/_Host");
    });
}
在上面的代码中,我们将身份验证中间件添加到自定义 API 中,以确保使用身份验证令牌进行访问。
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
@inject IAccessTokenProvider TokenProvider
@code {
    private HttpClient _httpClient;
    private string _accessToken;