在 Blazor 组件中获取当前用户

Question

我正在使用 Blazor 和 Windows 身份验证启动一个新站点，并且需要识别查看页面/组件的当前用户。

对于 Razor 页面，可以使用 Context.User.Identity.Name 访问当前用户名，但这似乎不适用于 Blazor 组件。我尝试将 HttpContext 注入组件，但 Context 在运行时为空。

作为奖励，我最终希望将其合并到 Startup.cs 中，因此我只需要获取一次用户名，并且可以为我的应用程序利用企业用户类（使用 EF Core）。也将不胜感激针对该用例量身定制的答案。

Answer 1

在组件中获取用户有三种可能（页面就是组件）：

1. 注入IHttpContextAccessor并从中访问HttpContext然后User；需要在Startup.ConfigureServices注册IHttpContextAccessor，一般使用AddHttpContextAccessor。编辑：根据Microsoft docs you must not do this for security reasons。
2. 注入AuthenticationStateProvider 属性，调用GetAuthenticationStateAsync 并从中获取User
3. 将您的组件包装在<CascadingAuthenticationState> 组件中，声明Task<AuthenticationState> 属性并调用它以获取User（类似于#2）

在此处查看更多信息：https://docs.microsoft.com/en-us/aspnet/core/security/blazor。

Answer 2

我现在已经能够让它与一个通用类以及一个组件一起工作。

访问HttpContext 用户；在ConfigureServices，在Startup.cs 添加

services.AddHttpContextAccessor();

我的CorporateUser 课程有一个CorporateUserService 课程。服务类通过构造函数注入获得DbContext。

然后我创建了一个新的CurrentCorporateUserService，它继承自CorporateUserService。它通过构造函数注入接受DbContext 和IHttpContextAccessor

public class CurrentCorporateUserService : CorporateUserService
{
    private readonly IHttpContextAccessor _httpContextAccessor;

    public CurrentCorporateUserService(IHttpContextAccessor httpContextAccessor,
        MyDbContext context) : base(context)
    {
        _httpContextAccessor = httpContextAccessor;
    }
    ...

基础服务类有一个方法GetUserByUsername(string username)。 Current 服务类增加了一个额外的方法

public CorporateUser GetCurrentUser()
{
    return base.GetUserByUsername(_httpContextAccessor.HttpContext.User.Identity.Name.Substring(8));
}

当前服务类注册在Startup.cs

services.AddScoped<CurrentCorporateUserService>();

完成后，我可以在带有指令注入的组件中使用CurrentCorporateUserService。

[Inject]
private CurrentCorporateUserService CurrentCorporateUserService { get; set; } = 
default!;

或在任何类中，使用构造函数注入。

public MyDbContext(DbContextOptions<MyDbContext> options,
    CurrentCorporateUserService CurrentCorporateUserService)
    : base(options) 
{
    _currentUser = CurrentCorporateUserService.GetCurrentUser();
}

使其成为项目范围的服务意味着我的所有开发人员都不必关心如何获取当前用户，他们只需将服务注入到他们的类中。

例如，在MyDbContext 中使用它使当前用户可用于每个保存事件。在下面的代码中，任何继承BaseReport 类的类都会在保存记录时自动更新报表元数据。

public override Int32 SaveChanges()
{         
    var entries = ChangeTracker.Entries().Where(e => e.Entity is BaseReport
    && (e.State == EntityState.Added || e.State == EntityState.Modified));

    foreach (var entityEntry in entries)
    {
        ((BaseReport)entityEntry.Entity).ModifiedDate = DateTime.Now;
        ((BaseReport)entityEntry.Entity).ModifiedByUser = _currentUser.Username;
    }

    return base.SaveChanges();
}

Answer 3

对我来说，第一个答案 2. 中提到的解决方案非常完美： 我在 .Net Core 5.0 上使用 Blazor 服务器端。 我注射了

@inject AuthenticationStateProvider GetAuthenticationStateAsync

在我的 Blazor 页面中并在代码部分添加以下内容：

protected async override Task OnInitializedAsync()
    {
        var authstate = await GetAuthenticationStateAsync.GetAuthenticationStateAsync();
        var user = authstate.User;
        var name = user.Identity.Name;
    }

在我的 startup.cs 中，我有以下几行：

services.AddScoped<ApiAuthenticationStateProvider>();
services.AddScoped<AuthenticationStateProvider>(p =>
                p.GetRequiredService<ApiAuthenticationStateProvider>());

Answer 4

对于blazor wasm 中的net 5.0 及更高版本。这是我的做法，

1. 如下所示，将<App> 组件包裹在<CascadingAuthenticationState> 中，

<CascadingAuthenticationState>
    <Router AppAssembly="@typeof(Program).Assembly">
        <Found Context="routeData">
            ...
        </Found>
        <NotFound>
            ...
        </NotFound>
    </Router>
</CascadingAuthenticationState>

1. 然后如下图在任意组件内添加Task<AuthenticationState>CascadingParameter，

public class AppRootBase : ComponentBase
{
    [CascadingParameter] private Task<AuthenticationState> authenticationStateTask { get; set; }
}

1. 现在您可以在组件内部访问登录用户Identity 和Claims，如下所示，

protected override async Task OnInitializedAsync()
{
    var authState = await authenticationStateTask;
    var user = authState.User;

    if (user.Identity.IsAuthenticated)
    {
        Console.WriteLine($"{user.Identity.Name} is authenticated.");
    }
}

这是来自Microsoft docs的参考。

Answer 5

我也有类似需求，一直在使用：

var authstate = await AuthenticationStateProvider.GetAuthenticationStateAsync();
var user = authstate.User;
var name = user.Identity.Name;

我的 startup.cs 中已经有一个AuthenticationStateProvider，并将其添加到我的自定义类的构造函数中。

Answer 6

如果您创建一个新项目并选择带有 Windows 身份验证的 Blazor，您将获得一个名为 Shared\LoginDisplay.razor 的文件，其中包含以下内容：

<AuthorizeView>
    Hello, @context.User.Identity.Name!
</AuthorizeView>

使用<AuthorizeView>，我们无需对任何页面进行任何修改即可访问@context.User.Identity.Name。

Answer 7

在您的 App.razor 中，确保元素封装在 CascadingAuthenticationState 元素中。如果您创建具有身份验证支持的 Blazor 项目，这是默认生成的。

</CascadingAuthenticationState>
    <Router AppAssembly="@typeof(Program).Assembly" PreferExactMatches="@true">
        <Found Context="routeData">
            <AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
        </Found>
        <NotFound>
            <LayoutView Layout="@typeof(MainLayout)">
                <p>Sorry, there's nothing at this address.</p>
            </LayoutView>
        </NotFound>
    </Router>
</CascadingAuthenticationState>

在您的组件中，您可以使用 AuthenticationStateProvider 访问当前用户，如下例所示：

@page "/"

@layout MainLayout

@inject AuthenticationStateProvider AuthenticationStateProvider
@inject SignInManager<IdentityUser> SignInManager

@code
{
    override protected async Task OnInitializedAsync()
    {
        var authenticationState = await AuthenticationStateProvider.GetAuthenticationStateAsync();

        if (SignInManager.IsSignedIn(authenticationState.User))
        {
            //Do something...
        }
    }
}

Answer 8

如果您在 Windows 上的 IIS 或 IIS Express 下运行，则以下解决方案仅有效。如果使用 'dotnet run' 在 kestrel 下运行，请按照此处的步骤操作，https://docs.microsoft.com/en-us/aspnet/core/security/authentication/windowsauth?view=aspnetcore-3.0&tabs=visual-studio#kestrel

[startup.cs]

public void ConfigureServices(IServiceCollection services)
{
    services.AddHttpContextAccessor();
}

[index.razor]

@page "/"
@using Microsoft.AspNetCore.Http
@inject IHttpContextAccessor httpContextAccessor

<h1>@UserName</h1>

@code {
    public string UserName;

    protected override async Task OnInitializedAsync()
    {
        UserName = httpContextAccessor.HttpContext.User.Identity.Name;
    }
}

Answer 9

我也有这个问题。我发现的最佳解决方案是同时注入UserManager 和AuthenticationStateProvider，然后我制作了这些扩展函数：

        public static async Task<CustomIdentityUser> GetUserFromClaimAsync(this 
        ClaimsPrincipal claimsPrincipal,
            UserManager<CustomIdentityUser> userManager)
        {
            var id = userManager.GetUserId(claimsPrincipal);
            return await userManager.FindByIdAsync(id);
        }

        public static async Task<CustomIdentityUser> GetCurrentUserAsync(this AuthenticationStateProvider provider, UserManager<CustomIdentityUser> UM)
        {
            return await (await provider.GetAuthenticationStateAsync()).User.GetUserFromClaimAsync(UM);
        }

        public static async Task<string> GetCurrentUserIdAsync(this AuthenticationStateProvider provider, UserManager<CustomIdentityUser> UM)
        {
            return UM.GetUserId((await provider.GetAuthenticationStateAsync()).User);
        }

Answer 10

对我来说，追逐移动目标是一段痛苦的旅程。在我的情况下，我只需要在 Razor 页面中使用的 Blazor 组件的用户名。我的解决方案需要以下内容：

在 Index.cshtml.cs 我添加了两个属性和构造函数

    public IHttpContextAccessor HttpContextAccessor { get; set; }
    public string UserName { get; set; }

    public TestModel(IHttpContextAccessor httpContextAccessor)
    {
        HttpContextAccessor = httpContextAccessor;
        if (HttpContextAccessor != null) UserName = HttpContextAccessor.HttpContext.User.Identity.Name;
    }

然后在我添加组件的 Index.cshtml 中，我调用它如下：

<component type="typeof(MyApp.Components.FileMain)" param-UserName="Model.UserName" render-mode="ServerPrerendered" />

在我的组件中，我使用文件后面的代码（使用公共类 FileMainBase 的 FileMain.razor.cs : ComponentBase）有代码：

    [Parameter]
    public string UserName { get; set; } = default!;

然后作为概念证明，我添加到 FileMain.razor 页面

    <div class="form-group-sm">
    <label class="control-label">User: </label>
    @if (UserName != null)
    {
        <span>@UserName</span>
    }
</div>

Answer 11

更新 - 这个答案不起作用。我没有将其删除，而是将其作为信息放在这里。请考虑该问题的其他答案。

1. 在 ConfigureServices 的 Startup.cs 中，添加 services.AddHttpContextAccessor();
2. 在您的组件类中 [注意：我使用启用了 null 类型的代码隐藏]

        [Inject]
        private IHttpContextAccessor HttpContextAccessor { get; set; } = default!;

        private string username = default!;

1. 在您的组件代码（代码后面）中，在protected override void OnInitialized()

        username = HttpContextAccessor.HttpContext.User.Identity.Name;

username 现在可以像任何其他变量一样在整个组件中使用。

但是，请参阅我在此问题中的其他答案，以添加从可用于任何类的服务中获取当前用户名。

Answer 12

这对我来说在单个页面上有效

添加到 Startup.cs

services.AddHttpContextAccessor();

在 Razor 组件页面上

@using Microsoft.AspNetCore.Http
@inject IHttpContextAccessor httpContextAccessor

<div>@GetCurrentUser()</div>

@code{
    protected string GetCurrentUser()
    {
        return httpContextAccessor.HttpContext.User.Identity.Name;
    }
}

Answer 13

您应该在登录后向用户添加所需的声明。

例如，我将 FullName 显示在网站顶部（AuthLinks 组件）而不是电子邮件。

[HttpPost]
    public async Task<IActionResult> Login(LoginVM model)
    {
        var user = await _userManager.FindByNameAsync(model.Email);
        if (user == null || !await _userManager.CheckPasswordAsync(user, model.Password))
            return Unauthorized("Email or password is wrong.");
        var signingCredentials = GetSigningCredentials();
        var claims = GetClaims(user);
        var tokenOptions = GenerateTokenOptions(signingCredentials, claims);
        var token = new JwtSecurityTokenHandler().WriteToken(tokenOptions);
        return Ok(new LoginDto { Token = token, FullName = user.FirstName + " " + user.LastName });
    }

@code {
    private LoginVM loginVM = new();

    [Inject]
    public AuthenticationStateProvider _authStateProvider { get; set; }

    private async Task SubmitForm()
    {
        var response = await _http.PostAsJsonAsync("api/accounts/login", loginVM);
        var content = await response.Content.ReadAsStringAsync();
        var loginDto = JsonSerializer.Deserialize<LoginDto>(content);
        await _localStorage.SetItemAsync("authToken", loginDto.Token);
        _http.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("bearer", loginDto.Token);
        (_authStateProvider as AuthStateProvider).NotifyLogin(loginDto.FullName);
        _navigationManager.NavigateTo("/");
    }
}

public void NotifyLogin(string fullName)
    {
        var authenticatedUser = new ClaimsPrincipal(new ClaimsIdentity(new[] { new Claim("FullName", fullName) }, "jwtAuthType"));
        var authState = Task.FromResult(new AuthenticationState(authenticatedUser));
        NotifyAuthenticationStateChanged(authState);
    }

<AuthorizeView>
    <Authorized>
        @context.User.FindFirst("FullName")?.Value
        <button class="btn btn-outline-danger mx-4" @onclick="LogOut">LogOut</button>
    </Authorized>
    <NotAuthorized>
        <a href="account/login" class="btn btn-outline-success mx-2">Login</a>
        <a href="account/register" class="btn btn-outline-primary mx-2" style="width:123.44px">Register</a>
    </NotAuthorized>
</AuthorizeView>

GitHub 项目链接： https://github.com/mammadkoma/Attendance

Answer 14

这对我有用：

替换：

@context.User.Identity.Name

与：

@context.User.Claims.Where(x => x.Type=="name").Select(x => x.Value).FirstOrDefault()