Can't navigate from Blazor Client to Blazor Server page

Question

Testing a Blazor Webassembly hosted app template I try to navigate from NavMenu.razor to a page from the server. The reasons:

• I want to keep the client packages as small as possible and store the heavy logic on the server.
• I try to protect critical pages behind a authorization. (Otherwise, as far as my understand is, someone could look inside the delivered DLL's on the client device to bypass the authorization. Please see: In Blazor WebAssembly apps, authentication checks can be bypassed because all client-side code can be modified by users).

Blazor.Client

NavMenuRazor.cs

<div class="@NavMenuCssClass nav-scrollable" @onclick="ToggleNavMenu">
    <nav class="flex-column">
        <div class="nav-item px-3">
            <NavLink class="nav-link" href="authorizetest">
                <span class="oi oi-list-rich" aria-hidden="true"></span> Authorize
            </NavLink>
        </div>
    </nav>
</div>

Blazor.Server

AuthorizeTest.razor

@page "/authorizetest"
@using Microsoft.AspNetCore.Authorization
@attribute [Authorize]

<h3>Authorized!</h3>
<p>Congratulations! You are allowed to see this!</p>


@code {

}

Error

[https://localhost:7138/authorizetest

Sorry, there's nothing at this address.

Question

Is this possible, and if, how?

Answer 1

Hi @Bernhard S

You should add the Razor Page/Components in the Client project, instead of the Server project.

A hosted Blazor WebAssembly solution includes the following ASP.NET Core projects:

• "Client": The Blazor WebAssembly app.
• "Server": An app that serves the Blazor WebAssembly app and weather data to clients.
• "Shared": A project that maintains common classes, methods, and resources. You can check the Server project Program.cs file, it doesn't configure the Blazor routing for the Razor components, so the navigate not working.

For the server project authorization issue, you can also configure JWT Authentication on the server project.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Best regards,

Dillion