What is the valid procedure to secure blazor client side app?

Question

I am trying to secure my blazor client-side app and have followed instructions from here https://docs.microsoft.com/en-us/aspnet/core/security/blazor/?view=aspnetcore-3.0&tabs=visual-studio

What confuses me is this section

public override Task<AuthenticationState> GetAuthenticationStateAsync()
        {
            var identity = new ClaimsIdentity(new[]
            {
                new Claim(ClaimTypes.Name, "mrfibuli"),
            }, "Fake authentication type");

            var user = new ClaimsPrincipal(identity);

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

Since authorization is only used to determine which UI options to show and client-side checks can be modified or bypassed by a user a Blazor WebAssembly app can't enforce authorization access rules.

So if I got it right, this is the valid procedure

user sends credentials via page/form
api returns a token
token is stored locally
reverse mechanism is implemented in GetAuthenticationStateAsync where a token is exchanged for user info

enet enet · Accepted Answer · 2019-11-07T11:19:31

a Blazor WebAssembly app can't enforce authorization access rules

That is correct... only the server can and should enforce authorization access rules. In Blazor WebAssembly App authorization is used for UI's purposes only.

reverse mechanism is implemented in GetAuthenticationStateAsync where a token is exchanged for user info

The GetAuthenticationStateAsync method does not ordinarily create the AuthenticationState object, and it is set somewhere else, but if you use a Blazor WebAssembly App, you must create a custom AuthenticationStateProvider and override this method to provide the AuthenticationState object. You should follow these steps:

Get the token, a Jwt token, for instance, from a local store
Parse the Jwt token; it should contains a collection of claims such as name, etc.
Create a ClaimsPrincipal object from those claims, and pass it to the constructor of the AuthenticationState object which you return from GetAuthenticationStateAsync to calling objects, such as the CascadingAuthenticationState component...

Hope this helps...

What is the valid procedure to secure blazor client side app?

1 Answers