Authentication

💡 You can always refer to the sample project for additional guidance.

In order to implement User authentication with this library, you need to implement the IAuthenticationService in your Blazor Server project and specify it when calling the AddBlazorAuth method in your Blazor Server Program.cs file.

Implementation

Create a class for your Sign-In payload. This class will be used to pass the user's credentials to the IAuthenticationService implementation.

Note
This class needs to be serializable, so it can be passed between the Client and Server projects over http.


// Example Sign-In payload
public class SignInPayload
{
    public string Email { get; set; }
    public string Password { get; set; }
}

Authentication Service

You can inherit from the base AuthenticationService class, or implement the IAuthenticationService interface directly.


// Example Authentication Service
public class MyAmazingAuthenticationService : AuthenticationService<SignInPayload>
{
    public override Task<AuthenticationResult> SignInAsync(SignInPayload signInPayload, CancellationToken cancellationToken = default)
    {
        var jwtPair = BuildJwtPair();
        var authResult = Success(jwtPair);

        return Task.FromResult(authResult);
    }

    public override Task<AuthenticationResult> RefreshJwtPairAsync(string refreshToken, CancellationToken cancellationToken = default)
    {
        var jwtPair = BuildJwtPair();
        var authResult = Success(jwtPair);

        return Task.FromResult(authResult);
    }

    private JwtPair BuildJwtPair()
    {
        return new JwtPair
        {
            AccessToken = "access-token-goes-here",
            RefreshToken = "refresh-token-goes-here"
        };
    }
}

Register the Authentication Service

Specify your IAuthenticationService implementation when calling the AddBlazorAuth method in your Blazor Server Program.cs file.


// Program.cs
builder.AddBlazorAuth<MyAmazingAuthenticationService>();

Add the authentication endpoints in your Blazor Server Program.cs. This is required in order to allow the Client project to call the Server's API and use the server-side IAuthenticationService implementation.


// Program.cs
app.MapAuthEndpoints();

User Service

You can now use IUserService in your Blazor Pages to sign the user in:


// MyPage.razor

[Inject] IUserService<SignInPayload> UserService { get; set; }

private async Task SignInAsync()
{
    // Simulating user input
    var signInPayload = new SignInPayload("some data");

    // Signing the user in
    var authenticationResult = await UserService.SignInAsync(signInPayload);

    // Refresh the page after signing in
    // to let Blazor know that the user's authentication state has changed
    NavigationManager.NavigateTo(NavigationManager.Uri, true);
}

For additional guidance, see sample flows in Use Cases section.

Token duration

You can specify the duration of your access token and refresh token whenever you are providing your JwtPair to Blazor.Auth. The duration of the access token should normally be short, while the refresh token should normally be long-lived.


return new JwtPair
    {
        AccessToken = "access-token-goes-here",
        RefreshToken = "refresh-token-goes-here",
        AccessTokenExpiresAt = DateTimeOffset.UtcNow.AddMinutes(15),
        RefreshTokenExpiresAt = DateTimeOffset.UtcNow.AddDays(7)
    }

⚠️ Not providing an expiration date for the tokens will result in them being session-scoped. This means that the tokens will expire when the browser tab closes.

Sign out

You can sign the user out by calling the SignOutAsync method of the IUserService. This will clear the user's token cookies.


await UserService.SignOutAsync();
NavigationManager.NavigateTo("/", true);