Blazor authorize attribute not detecting roles

Question

I'm trying to use the authorize attribute with roles but it doesn't seem to be detecting the roles correctly. The first component below I'd expect to work as my user is in the system admin role but when I navigate to the page I get 'Error: 403 Forbidden' but if I go to the second component that lists out all the claims the role 'System Admin' is present.

I've tried moving things around in the program.cs to see if it is an order of dependancy injection issue but it hasn't helped.

@page "/standardUserTest"
@using Microsoft.AspNetCore.Authorization
@attribute [Authorize(Roles = "System Admin, Service")]
 
<h3>StandardUserTest</h3>
 
@code {
 
}

component 2

@page "/viewUserDetails"
@using Microsoft.AspNetCore.Authorization
@using System.Text.Json
@using MasterDataModels.Models
@using Microsoft.AspNetCore.Components.Authorization
@using System.Security.Claims
@inject AuthenticationStateProvider AuthenticationStateProvider
 
@attribute [Authorize]
 
<h3>ViewUserDetails</h3>
 
@if (ClaimsPrincipalUser.Claims is not null)
{
    @foreach (var claim in ClaimsPrincipalUser.Claims)
    {
        <div>@claim.Type : @claim.Value </div>
    }
}
 
@code {
    ClaimsPrincipal ClaimsPrincipalUser;
 
    protected override async Task OnInitializedAsync()
    {
        var authState = await AuthenticationStateProvider.GetAuthenticationStateAsync();
        ClaimsPrincipalUser = authState.User;
 
        if (ClaimsPrincipalUser.Identity != null)
        {
            var useridentity = ClaimsPrincipalUser.Identity.Name;
        }
    }
}

program.cs

using DealsheetAuthPOC.Components;
using Microsoft.AspNetCore.Authentication.Negotiate;
using Microsoft.AspNetCore.Components.Authorization;
 
namespace DealsheetAuthPOC
{
    public class Program
    {
        public static void Main(string[] args)
        {
            var builder = WebApplication.CreateBuilder(args);
 
            builder.Services.AddAuthentication(NegotiateDefaults.AuthenticationScheme)
                .AddNegotiate();
 
            builder.Services.AddAuthorization(options =>
            {
                // By default, all incoming requests will be authorized according to the default policy.
                //options.FallbackPolicy = options.DefaultPolicy;
            });
            builder.Services.AddScoped<AuthenticationStateProvider, FinningAuthProvider>();
 
            // Add services to the container.
            builder.Services.AddRazorComponents()
                .AddInteractiveServerComponents();
 
            var app = builder.Build();
 
            // Configure the HTTP request pipeline.
            if (!app.Environment.IsDevelopment())
            {
                app.UseExceptionHandler("/Error");
                // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
                app.UseHsts();
            }
 
            app.UseHttpsRedirection();
 
            app.UseStaticFiles();
            app.UseAntiforgery();
 
            app.MapRazorComponents<App>()
                .AddInteractiveServerRenderMode();
 
            app.Run();
 
 
        }
    }
}

Answer 1

You need a refrence to AuthenticationState

This can either be adding CascadingAuthenticationState to the App.razor page or specific components by adding

<CascadingAuthenticationState>
// the rest of your page code
</CascadingAuthenticationState>

or by having a parameter in your component

[CascadingParameter]
private Task<AuthenticationState>? AuthState { get; set; }