ASP.NET Core Blazor 인증 상태

이 문서에서는 사용자 지정 인증 상태 공급자 를 만들고 코드에서 사용자 인증 상태 변경 알림을 받는 방법을 설명합니다.

서버 쪽 및 클라이언트 쪽 Blazor 앱에 대해 수행되는 일반적인 접근 방식은 유사하지만 정확한 구현은 다르므로 이 문서에서는 서버 쪽 앱과 클라이언트 쪽 Blazor Blazor 앱 간에 피벗합니다. 아티클 맨 위에 있는 피벗 선택기를 사용하여 작업 중인 프로젝트 유형 Blazor 과 일치하도록 아티클의 피벗을 변경합니다.

• 서버 쪽 Blazor 앱(Server피벗): Blazor Server .NET 7 이하 및 .NET 8 이상의 서버 프로젝트 Blazor Web App
• 클라이언트 쪽 Blazor 앱(Blazor WebAssembly 피벗): Blazor WebAssembly .NET의 모든 버전 또는 .Client .NET 8 이상용 프로젝트의 Blazor Web App 경우.

추상 AuthenticationStateProvider 클래스

프레임워크에는 Blazor 다음 멤버를 사용하여 현재 사용자의 인증 상태에 대한 정보를 제공하는 추상 AuthenticationStateProvider 클래스가 포함되어 있습니다.

• GetAuthenticationStateAsync: 현재 사용자의 인증 상태를 비동기적으로 가져옵니다.
• AuthenticationStateChanged: 인증 상태가 변경될 때 알림을 제공하는 이벤트입니다. 예를 들어 사용자가 앱에 로그인하거나 앱에서 로그아웃하는 경우 이 이벤트가 발생할 수 있습니다.
• NotifyAuthenticationStateChanged: 인증 상태가 변경된 이벤트를 발생합니다.

사용자 지정 AuthenticationStateProvider를 구현합니다.

앱은 앱에 Microsoft.AspNetCore.Components.Authorization 대한 Blazor 인증 및 권한 부여 지원을 제공하는 NuGet 패키지를 참조해야 합니다.

using Microsoft.AspNetCore.Components.Authorization;

...

builder.Services.AddAuthorization();
builder.Services.AddCascadingAuthenticationState();

using Microsoft.AspNetCore.Components.Authorization;

...

builder.Services.AddAuthorization();

using Microsoft.AspNetCore.Components.Authorization;

...

services.AddAuthorization();

using Microsoft.AspNetCore.Components.Authorization;

...

builder.Services.AddAuthorizationCore();
builder.Services.AddCascadingAuthenticationState();

using Microsoft.AspNetCore.Components.Authorization;

...

builder.Services.AddAuthorizationCore();

서브클래스 AuthenticationStateProvider 및 재정 GetAuthenticationStateAsync 의하여 사용자의 인증 상태를 만듭니다. 다음 예제에서는 모든 사용자가 사용자 이름으로 mrfibuli인증됩니다.

CustomAuthStateProvider.cs:

using System.Security.Claims;
using Microsoft.AspNetCore.Components.Authorization;

public class CustomAuthStateProvider : AuthenticationStateProvider
{
    public override Task<AuthenticationState> GetAuthenticationStateAsync()
    {
        var identity = new ClaimsIdentity(
        [
            new Claim(ClaimTypes.Name, "mrfibuli"),
        ], "Custom Authentication");

        var user = new ClaimsPrincipal(identity);

        return Task.FromResult(new AuthenticationState(user));
    }
}

builder.Services.AddScoped<AuthenticationStateProvider, CustomAuthStateProvider>();

builder.Services.AddServerSideBlazor();

builder.Services.AddScoped<AuthenticationStateProvider, CustomAuthStateProvider>();

services.AddServerSideBlazor();

services.AddScoped<AuthenticationStateProvider, CustomAuthStateProvider>();

builder.Services.AddSingleton<AuthenticationStateProvider, CustomAuthStateProvider>();

없는 경우 파일에 문을 _Imports.razor 추가하여 @using 구성 요소 간에 네임스페이 Microsoft.AspNetCore.Components.Authorization 스를 사용할 수 있도록 합니다.

@using Microsoft.AspNetCore.Components.Authorization;

<Router ...>
    <Found ...>
        <AuthorizeRouteView RouteData="routeData" 
            DefaultLayout="typeof(Layout.MainLayout)" />
        ...
    </Found>
</Router>

<CascadingAuthenticationState>
    <Router ...>
        <Found ...>
            <AuthorizeRouteView RouteData="routeData" 
                DefaultLayout="typeof(MainLayout)" />
            ...
        </Found>
    </Router>
</CascadingAuthenticationState>

다음 예제 AuthorizeView 구성 요소는 인증된 사용자의 이름을 보여 줍니다.

<AuthorizeView>
    <Authorized>
        <p>Hello, @context.User.Identity?.Name!</p>
    </Authorized>
    <NotAuthorized>
        <p>You're not authorized.</p>
    </NotAuthorized>
</AuthorizeView>

사용 AuthorizeView지침은 ASP.NET Core Blazor 인증 및 권한 부여를 참조하세요.

인증 상태 변경 알림

사용자 지정 AuthenticationStateProvider 은 기본 클래스에서 AuthenticationStateProvider 호출 NotifyAuthenticationStateChanged 하여 소비자에게 다시 렌더링할 인증 상태 변경을 알릴 수 있습니다.

다음 예제는 이 문서의 앞부분에 있는 사용자 지정 AuthenticationStateProvider 구현 섹션의 지침에 따라 사용자 지정 AuthenticationStateProvider 구현을 기반으로 합니다. 해당 섹션의 지침을 이미 따른 경우 다음은 CustomAuthStateProvider 섹션에 표시된 지침을 대체합니다.

다음 CustomAuthStateProvider 구현에서는 사용자 지정 메서드 AuthenticateUser를 노출하여 사용자를 로그인하고 소비자에게 인증 상태 변경을 알립니다.

CustomAuthStateProvider.cs:

using System.Security.Claims;
using Microsoft.AspNetCore.Components.Authorization;

public class CustomAuthStateProvider : AuthenticationStateProvider
{
    public override Task<AuthenticationState> GetAuthenticationStateAsync()
    {
        var identity = new ClaimsIdentity();
        var user = new ClaimsPrincipal(identity);

        return Task.FromResult(new AuthenticationState(user));
    }

    public void AuthenticateUser(string userIdentifier)
    {
        var identity = new ClaimsIdentity(
        [
            new Claim(ClaimTypes.Name, userIdentifier),
        ], "Custom Authentication");

        var user = new ClaimsPrincipal(identity);

        NotifyAuthenticationStateChanged(
            Task.FromResult(new AuthenticationState(user)));
    }
}

구성 요소에서:

• AuthenticationStateProvider를 삽입합니다.
• 사용자의 식별자를 저장할 필드를 추가합니다.
• 사용자 식별자를 사용하여 캐스팅 AuthenticationStateProvider 하고 호출 AuthenticateUser 하는 CustomAuthStateProvider 단추와 메서드를 추가합니다.

@inject AuthenticationStateProvider AuthenticationStateProvider

<input @bind="userIdentifier" />
<button @onclick="SignIn">Sign in</button>

<AuthorizeView>
    <Authorized>
        <p>Hello, @context.User.Identity?.Name!</p>
    </Authorized>
    <NotAuthorized>
        <p>You're not authorized.</p>
    </NotAuthorized>
</AuthorizeView>

@code {
    public string userIdentifier = string.Empty;

    private void SignIn()
    {
        ((CustomAuthStateProvider)AuthenticationStateProvider)
            .AuthenticateUser(userIdentifier);
    }
}

사용자 지정 서비스를 통해 인증 상태 변경에 대한 알림을 트리거하도록 앞의 접근 방식을 개선할 수 있습니다. 다음 CustomAuthenticationService 클래스는 인증 상태 공급자가 구독할 수 있는 이벤트()를 사용하여 백업 필드(currentUserUserChanged)에서 현재 사용자의 클레임 주체를 유지 관리합니다. 여기서 이벤트가 호출됩니다NotifyAuthenticationStateChanged. 이 섹션 CustomAuthenticationService 의 뒷부분에 추가 구성을 사용하여 이벤트를 트리거 UserChanged 하도록 설정하는 논리를 사용하여 구성 요소에 CurrentUser 삽입할 수 있습니다.

CustomAuthenticationService.cs:

using System.Security.Claims;

public class CustomAuthenticationService
{
    public event Action<ClaimsPrincipal>? UserChanged;
    private ClaimsPrincipal? currentUser;

    public ClaimsPrincipal CurrentUser
    {
        get { return currentUser ?? new(); }
        set
        {
            currentUser = value;

            if (UserChanged is not null)
            {
                UserChanged(currentUser);
            }
        }
    }
}

builder.Services.AddScoped<CustomAuthenticationService>();

services.AddScoped<CustomAuthenticationService>();

builder.Services.AddSingleton<CustomAuthenticationService>();

다음은 CustomAuthStateProvider 이벤트를 구독합니다 CustomAuthenticationService.UserChanged . 메서드는 GetAuthenticationStateAsync 사용자의 인증 상태를 반환합니다. 처음에는 인증 상태가 .의 값을 기반으로 합니다 CustomAuthenticationService.CurrentUser. 사용자가 변경되면 호출에 대한 새 사용자(new AuthenticationState(newUser))에 대한 GetAuthenticationStateAsync새 인증 상태가 만들어집니다.

using Microsoft.AspNetCore.Components.Authorization;

public class CustomAuthStateProvider : AuthenticationStateProvider
{
    private AuthenticationState authenticationState;

    public CustomAuthStateProvider(CustomAuthenticationService service)
    {
        authenticationState = new AuthenticationState(service.CurrentUser);

        service.UserChanged += (newUser) =>
        {
            authenticationState = new AuthenticationState(newUser);
            NotifyAuthenticationStateChanged(Task.FromResult(authenticationState));
        };
    }

    public override Task<AuthenticationState> GetAuthenticationStateAsync() =>
        Task.FromResult(authenticationState);
}

다음 구성 요소의 SignIn 메서드는 설정할 CustomAuthenticationService.CurrentUser사용자 식별자에 대한 클레임 보안 주체를 만듭니다.

@using System.Security.Claims
@inject CustomAuthenticationService AuthService

<input @bind="userIdentifier" />
<button @onclick="SignIn">Sign in</button>

<AuthorizeView>
    <Authorized>
        <p>Hello, @context.User.Identity?.Name!</p>
    </Authorized>
    <NotAuthorized>
        <p>You're not authorized.</p>
    </NotAuthorized>
</AuthorizeView>

@code {
    public string userIdentifier = string.Empty;

    private void SignIn()
    {
        var currentUser = AuthService.CurrentUser;

        var identity = new ClaimsIdentity(
            [
                new Claim(ClaimTypes.Name, userIdentifier),
            ],
            "Custom Authentication");

        var newUser = new ClaimsPrincipal(identity);

        AuthService.CurrentUser = newUser;
    }
}

추가 리소스