Authorization on Route
Blazor Server provides 2 different approaches to authorize users: AuthorizeRouteView
and AuthorizeView
. Both authorize users and provide their content according to their privilege.
This guide provides information to help you decide which type of authorization works best for your situation. It introduces how to use the AuthorizeRouteView
, if you need information about AuthorizeView
, see Authentication and authorization. It also summarizes the key differences between the 2 approaches.
You can download the example code used in this topic on GitHub.
Choosing an approach
AuthorizeRouteView
and AuthorizeView
authorize user and display content based on the user's privilege. Each approach offers different advantages.
AuthorizeView
performs authorization at the component level, meaning that you will have more control over this. You can display unauthorized and authorizing messages differently for different components.
AuthorizeRouteView
as the name suggested, it performs authorization on the route, meaning that you will have a consistent display unauthorized and authorizing messages on the entire website.
Key differences
The table below summarizes the key differences between AuthorizeRouteView
and AuthorizeView
.
|
AuthorizeRouteView |
AuthorizeView |
Need CascadingAuthenticationState component? |
No |
Yes |
Declare in |
App.razor |
HTML template section of the component |
Pass authorization parameter |
As a parameter of Authorize attribute |
As a parameter of AuthorizeView |
Setting up the authorization
In order to have the authorization, you need to setup the AuthenticationStateProvider
first, see Authentication and authorization. The next step is to replace the RouteView
component with AuthorizeRouteView
component in App.razor
.
<Router AppAssembly="@typeof(Program).Assembly" PreferExactMatches="@true">
<Found Context="routeData">
<AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)">
<NotAuthorized>
You are not authorized.
</NotAuthorized>
<Authorizing>
Authorizing in process...
</Authorizing>
</AuthorizeRouteView>
</Found>
<NotFound>
<LayoutView Layout="@typeof(MainLayout)">
<p>Sorry, there's nothing at this address.</p>
</LayoutView>
</NotFound>
</Router>
To do the authorization for a component, add the @attribute
directive to use the Authorize
attribute.
@attribute [Authorize]
If you don't specify any parameters then by default, Blazor Server will require the user to complete the authentication. To authorize the users by role or policy, simply pass it to the Authorize
attribute like this.
@attribute [Authorize(Roles = "Admin,SuperAdmin", Policy = "CanBuyAlcohol")]