how to change Blazor WASM identity net core 3.1 messages "You are logged out", "checking login state" and "authorizing"?

Question

I need to know how to personalize and/or change language for this messages, I suppose it has to do with IdentityServer4.

Any ideas?

Answer 1

What you are looking for is the RemoteAuthenticatorView .

You can find more details for your answer in the official documentation.

@page "/security/{action}"
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication

<RemoteAuthenticatorView Action="@Action">
    @*authentication/login*
    <LoggingIn></LoggingIn> 
    @*authentication/login-callback*
    <CompletingLoggingIn></CompletingLoggingIn>
    @*authentication/login-failed*
    <LogInFailed></LogInFailed>
    @*authentication/logout*
    <LogOut></LogOut>
    @*authentication/logout-callback*
    <CompletingLogOut></CompletingLogOut>
    @*authentication/logout-failed*
    <LogOutFailed></LogOutFailed>
    @*authentication/logged-out*
    <LogOutSucceeded></LogOutSucceeded>
    @*authentication/profile*
    <UserProfile></UserProfile>
    @*authentication/register*
    <Registering></Registering>
</RemoteAuthenticatorView>

@code{
    [Parameter]
    public string Action { get; set; }
}

Answer 2

It is necessary to add some tags in Authentication.razor component:

@page "/authentication/{action}"
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication

<RemoteAuthenticatorView Action="@Action">
    <LogInFailed>
        <div class="alert alert-danger" role="alert">@strLogInFailed</div>
    </LogInFailed>
    <LogOut>
        <div class="alert alert-info" role="alert">@strLogOut</div>
    </LogOut>
    <LogOutSucceeded>
        <div class="alert alert-success" role="alert">@strLogOutSucceeded</div>
    </LogOutSucceeded>
    <LoggingIn>
        <div class="alert alert-info" role="alert">@strLoggingIn</div>
    </LoggingIn>
    <CompletingLoggingIn>
        <div class="alert alert-success" role="alert">@strCompletingLoggingIn</div>
    </CompletingLoggingIn>
</RemoteAuthenticatorView>

@code {
    [Parameter] public string Action { get; set; }

    string strLogInFailed = "Your login was not successful.";
    string strLogOut = "Trying to close your session.";
    string strLogOutSucceeded = "Your session has been closed successfully.";
    string strLoggingIn = "Redirecting to the login screen.";
    string strCompletingLoggingIn = "Your login was successful.";
}

I found how to do it in: Custom Authentication User Interface which, by the way, explains a lot on

How to Secure Blazor WebAssembly with IdentityServer4

After read it, I also check the RemoteAuthenticatorView Class

Even accomplished this, still persist the "Authorizing..." message.