Razor Page not rendering

11 hours ago 3
ARTICLE AD BOX

I'm building a simple login page (Login page -> Dashboard page with cookie authentication). I'm using Blazor web assembly. I'm using ChatGPT to guide and pretty much explain any error I encountered.

After following some tutorials, this is what I came up with. The problem right now is only the URL changes after clicking login. I tried anything I found on the net and I'm still stuck on this problem. Forgive me if this might be a super newbie post as I just started learning it today.

Program.cs:

using BCrypt.Net; using HrisClient.Components; using HrisClient.Data; using HrisClient.Services; using Microsoft.AspNetCore.Authentication; using Microsoft.AspNetCore.Authentication.Cookies; using Microsoft.AspNetCore.Components; using Microsoft.EntityFrameworkCore; using System.Security.Claims; using LoginRequest = HrisClient.Models.LoginRequest; var builder = WebApplication.CreateBuilder(args); builder.Services.AddRazorComponents() .AddInteractiveServerComponents(); builder.Services.AddScoped(sp => { var nav = sp.GetRequiredService<NavigationManager>(); return new HttpClient { BaseAddress = new Uri(nav.BaseUri) }; }); builder.Services.AddDbContext<AppDbContext>(options => options.UseNpgsql(builder.Configuration.GetConnectionString("DefaultConnection"))); builder.Services.AddHttpContextAccessor(); builder.Services.AddScoped<AuthService>(); builder.Services.AddAuthentication(CookieAuthenticationDefaults.AuthenticationScheme) .AddCookie(options => { options.LoginPath = "/login"; }); builder.Services.AddAuthorization(); builder.Services.AddCascadingAuthenticationState(); var app = builder.Build(); app.UseStaticFiles(); app.UseRouting(); // ✅ CRITICAL FIX app.UseAuthentication(); app.UseAuthorization(); app.UseAntiforgery(); app.MapRazorComponents<App>() .AddInteractiveServerRenderMode(); app.MapPost("/auth/login", async ( HttpContext http, AppDbContext db, LoginRequest request) => { var user = await db.Users .FirstOrDefaultAsync(x => x.UserUsername == request.Username); if (user == null) return Results.Unauthorized(); if (!BCrypt.Net.BCrypt.Verify(request.Password, user.UserPassword)) return Results.Unauthorized(); var claims = new List<Claim> { new Claim(ClaimTypes.Name, user.UserUsername), new Claim("UserPslId", user.UserPslId?.ToString() ?? "") }; var identity = new ClaimsIdentity(claims, CookieAuthenticationDefaults.AuthenticationScheme); var principal = new ClaimsPrincipal(identity); await http.SignInAsync( CookieAuthenticationDefaults.AuthenticationScheme, principal); return Results.Ok(); }); app.Run();

Login.cs:

@page "/login" @layout LoginLayout @using HrisClient.Services @inject AuthService Auth @inject NavigationManager Nav @inject HttpClient Http @rendermode InteractiveServer <PageTitle>HRIS Login</PageTitle> <h1 style="color:red">LOGIN PAGE LOADED</h1> <div class="login-container"> <div class="login-card"> <h2>HRIS Login</h2> <p class="subtitle">Sign in to continue</p> <input class="input" placeholder="Username" @bind="username" /> <input class="input" type="password" placeholder="Password" @bind="password" /> <button class="btn" @onclick="LoginUser">Login</button> @if (!string.IsNullOrEmpty(error)) { <div class="error">@error</div> } </div> </div> <p style="color:red">@error</p> @code { string username = ""; string password = ""; string? error; async Task LoginUser() { error = null; var response = await Http.PostAsJsonAsync("/auth/login", new { Username = username, Password = password }); if (response.IsSuccessStatusCode) { Nav.NavigateTo("/dashboard", forceLoad: false); } else { error = "Invalid username or password"; } } }

Dashboard.cs:

@page "/dashboard" @using HrisClient.Services @attribute [Microsoft.AspNetCore.Authorization.Authorize] @inject AuthService Auth @inject NavigationManager Nav <h3>DASHBOARD LOADED</h3>
Read Entire Article