Updated How-To for Blazor 8? Auth0 article on covers Blazor 6

Ready to post? :mag: First, try searching for your answer.
The How-To for Auth0 with the latest Blazor (.NET 8 / Blazor 8) is out of date and doesn’t work. Can it be updated, please? I can’t get the Login/Logout pages to be recognized. I did fix the issue where it says to modify App.razor, when it really needs to be Routes.razor in the latest version.

Thanks! Not sure how else to get support so I can move forward upgrading my old non-Blazor app.

How to Build and Secure Web Applications with Blazor (auth0.com)

I found the necessary changes after reviewing the Git repo attached at the end. The instructions in the article are a bit different than what was in the repo, so here are the highlights:

If using .NET 8 and Blazor 8, do the following:

Instead of modifying Index.razor, modify the Components/App.Razor as follows:

`@using Liq.BlazorWebsite.Components.Layout

@code{
[CascadingParameter]
private HttpContext HttpContext { get; set; } = default!;

private IComponentRenderMode? RenderModeForPage => HttpContext.Request.Path.StartsWithSegments("/Account")
    ? null
    : InteractiveServer;

}`

Instead of creating the Login.cshtml pages, modify Program.cs as follows:

Before builder.Services.AddRazorComponents() add:

`
// Configure Auth0.
builder.Services
.AddAuth0WebAppAuthentication(options => {
options.Domain = builder.Configuration[“Auth0:Domain”];
options.ClientId = builder.Configuration[“Auth0:ClientId”];
});
builder.Services.AddCascadingAuthenticationState(); // new
builder.Services.AddScoped<AuthenticationStateProvider, PersistingRevalidatingAuthenticationStateProvider>(); // new

Then, after app.UseAntiforgery() add:

// Map Auth0 endpoints.
app.MapGet(“/Account/Login”, async (HttpContext httpContext, string redirectUri = “/”) =>
{
var authenticationProperties = new LoginAuthenticationPropertiesBuilder()
.WithRedirectUri(redirectUri)
.Build();

await httpContext.ChallengeAsync(Auth0Constants.AuthenticationScheme, authenticationProperties);

});

app.MapGet(“/Account/Logout”, async (HttpContext httpContext, string redirectUri = “/”) =>
{
var authenticationProperties = new LogoutAuthenticationPropertiesBuilder()
.WithRedirectUri(redirectUri)
.Build();

await httpContext.SignOutAsync(Auth0Constants.AuthenticationScheme, authenticationProperties);
await httpContext.SignOutAsync(CookieAuthenticationDefaults.AuthenticationScheme);

});
`

This article is for .NET 6 and 7. With .NET 8 many things have changed in the Blazor application model. Please, refer to the following articles for Blazor in .NET 8:

1 Like