How to add Authorization for Blazor Menu component?
This article explains how to show different menu based on user logged in using Authorization and Blazor Menu Bar component.
To show menu based on authentication state and user, you can obtain the authentication state data by defining a cascading parameter of type Task<AuthenticationState>. In the following example, the menu items are assigned to SfMenu based on username in OnInitializedAsync method.
@page "/adminpage"
@using Syncfusion.Blazor.Navigations
@attribute [Authorize(Roles="user, admin")]
@if (items != null)
{
<SfMenu TValue="MenuItem">
<MenuItems>
@foreach(var item in items)
{
<MenuItem Text="@item.Text"></MenuItem>
}
</MenuItems>
</SfMenu>
}
@code{
private List<MenuData> items;
[CascadingParameter]
private Task<AuthenticationState> authenticationStateTask { get; set; }
protected override async Task OnInitializedAsync()
{
await base.OnInitializedAsync();
var user = (await authenticationStateTask).User;
items = new List<MenuData>();
items.Add(new MenuData { Text = "Home" });
items.Add(new MenuData { Text = "Reports" });
if (user.IsInRole("user"))
{
items.Add(new MenuData { Text = "User" });
}
if (user.IsInRole("admin"))
{
items.Add(new MenuData { Text = "Adminstration" });
}
items.Add(new MenuData { Text = "Contact Us" });
}
public class MenuData
{
public string Text
{
get;
set;
}
}
}
Figure 1Menu bar when logged in as user
Figure 2Menu bar when logged in as admin
See also
Blazor Menu Bar Getting Started
Conclusion
I hope you enjoyed learning about how to add Authorization for the Blazor Menu component.
You can refer to our Blazor Menu Bar feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications. You can also explore our Blazor Menu Bar example to understand how to create and manipulate data.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.
If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!
