Question

我正在使用Blazor WebAssembly Asp.Net Core hosted PWA并将AspNetCore.Identity集成到其中。我在客户端创建了AuthenticationStateProvider，现在我想允许用户访问需要对其进行授权的控制器。

我已经通过邮递员进行了测试，已经创建了用户，并以正确的凭据将它们存储为DB aspnetusers。登录/帐户控制器按我的要求工作。

获得用户授权后，访问授权控制器请求时，它将在浏览器中告知该异常：

Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer [100] 未处理的异常呈现组件：响应状态代码未指示成功：401（未授权）。 System.Net.Http.HttpRequestException：响应状态代码不表示成功：401（未授权）。

Startup.cs（ConfigureServices-方法）：

...
    serviceCollection.AddDbContext<SQLiteTestDbContext>(options =>
                {
                    options.UseSqlite(config["ConnectionStrings:SQLiteTestConnection"]);
                });
                serviceCollection.AddDefaultIdentity<IdentityUser>()
                    .AddEntityFrameworkStores<SQLiteTestDbContext>()
                    .AddDefaultTokenProviders();

    services.AddAuthentication(x =>
                    {
                        x.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme;
                    })
                    .AddJwtBearer(options =>
                    {
                        options.TokenValidationParameters = new TokenValidationParameters
                        {
                            ValidateIssuer = true,
                            ValidateAudience = true,
                            ValidateLifetime = true,
                            ValidateIssuerSigningKey = true,
                            ValidIssuer = Configuration["JwtIssuer"],
                            ValidAudience = Configuration["JwtAudience"],
                            IssuerSigningKey = new SymmetricSecurityKey(Encoding.UTF8.GetBytes(Configuration["JwtSecurityKey"]))
                        };
                    });

    services.AddHttpContextAccessor();
                services.Configure<IdentityOptions>(options =>
                    options.ClaimsIdentity.UserIdClaimType = ClaimTypes.NameIdentifier);
...

 

    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
      
    ...
        app.UseAuthentication();
        app.UseAuthorization();
    ...
    }

Program.cs客户端


    public static async Task Main(string[] args)
            {
                var builder = WebAssemblyHostBuilder.CreateDefault(args);
                builder.RootComponents.Add<App>("app");
                builder.Logging.SetMinimumLevel(LogLevel.Warning);
    
                //Registering Shared-Library models
                builder.Services.AddScoped<ObjectModel>();

                builder.Services.AddBlazoredLocalStorage();
                builder.Services.AddAuthorizationCore();
                builder.Services.AddScoped<AuthenticationStateProvider, ApiAuthenticationStateProvider>();
                builder.Services.AddScoped<IAuthService, AuthService>();
    
                //Registered BlazorContextMenu Service
                builder.Services.AddBlazorContextMenu();
    
                //Registering FileReader service, for image upload -> Azure
                builder.Services.AddFileReaderService(options => options.UseWasmSharedBuffer = true);
                builder.Services.AddTransient(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
    
                await builder.Build().RunAsync();
            }

具有授权属性的我的控制器：


    [Authorize(AuthenticationSchemes = JwtBearerDefaults.AuthenticationScheme)]
        [Route("api/[controller]")]
        [ApiController]
        public class ObjectController : ControllerBase
        {
....

Answer 1

注意：

当您的用户尝试访问客户端上受保护的页面（标有Authorize属性）时，他应该首先登录或注册。
为了注册，应该将他重定向到一个帐户控制器，在其中您应该创建一个新用户，并将其添加到数据库中（您说过“将AspNetCore.Identity集成到其中”），这是很好...应该用于验证和验证用户的身份。您的帐户控制器还应生成一个Jwt令牌，该令牌应传递到客户端应用程序，并存储在本地存储中。
现在，每当用户尝试访问Web Api端点上的受保护资源时，都应从本地存储中检索Jwt令牌，并将其添加到请求标头中。如果您这样做，那么未经授权的回复将成为过去。
自定义AuthenticationStateProvider可能是一个不错的地方，您可以从中管理Jwt令牌存储在本地存储中，并为出站HTTP请求调用检索它。

以下示例代码阐明了您应该执行的操作：

@code {
    WeatherForecast[] forecasts;

    protected override async Task OnInitializedAsync()
    {
        var token = await TokenProvider.GetTokenAsync();
        forecasts = await Http.GetJsonAsync<WeatherForecast[]>(
            "api/WeatherForecast",
            new AuthenticationHeaderValue("Bearer", token));
    }
}

注意：TokenProvider是一个自定义AuthenticationStateProvider，它定义了一个称为GetTokenAsync的方法，该方法提供（从本地存储读取Jwt令牌并将其传递给调用代码）Jwt令牌

希望这对您有帮助...

Blazor WebAssembly 401未经授权，即使我被授权

1 个答案: