Table of Contents

Configure the Client

The interactive Client uses SessionAuth-aware services and the host origin for integrated RecroGrid Framework communication.

For the complete host and Client configuration reference, see Server-side Application configuration.

Configure the interactive Client so it stays aligned with the authenticated host session and communicates through the host origin.

Register SessionAuth-aware Client services

In the Client Program.cs, register SessionAuth together with Recrovit component routing services.

using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using Recrovit.AspNetCore.Components.Routing.Configuration;
using Recrovit.RecroGridFramework.Client.Blazor;
using Recrovit.RecroGridFramework.Client.Blazor.SessionAuth;
using Recrovit.RecroGridFramework.Client.Blazor.UI;

var builder = WebAssemblyHostBuilder.CreateDefault(args);

builder.Services.AddRgfBlazorSessionAuthClientServices(
    builder.Configuration,
    apiBaseAddressOverride: builder.HostEnvironment.BaseAddress);

builder.Services.AddRecrovitComponentRouting(options =>
{
    options.AddRouteAssembly(typeof(Program).Assembly);
});

var host = builder.Build();

await host.Services.InitializeRgfBlazorAsync();
await host.Services.InitializeRgfUIAsync();

await host.RunAsync();

builder.HostEnvironment.BaseAddress keeps RecroGrid Framework calls on the application host origin, where SessionAuth and the API proxy are integrated.

Configure the Client route shell

Render Client routes through RecrovitRoutes.

@using Recrovit.AspNetCore.Components.Routing
@using Recrovit.AspNetCore.Components.Routing.Models

<RecrovitRoutes Kind="RecrovitRoutesKind.Client"
                AppAssembly="typeof(_Imports).Assembly"
                DefaultLayout="typeof(MainLayout)"
                NotFoundPage="typeof(Pages.NotFound)" />

Configure the shared root for route-aware rendering

Configure the host App.razor so each route uses its registered route mode and corresponding top-level render mode.

@using Microsoft.AspNetCore.Components
@using Microsoft.AspNetCore.Components.Web
@using Recrovit.AspNetCore.Components.Routing
@using Recrovit.AspNetCore.Components.Routing.Models
@using Recrovit.AspNetCore.Components.Routing.Resolution

<head>
    <HeadOutlet @rendermode="CurrentRenderMode" />
</head>

<body>
    @if (CurrentPageDefinition.RouteMode is RecrovitRouteMode.StaticServer or RecrovitRouteMode.InteractiveServer)
    {
        <RecrovitRoutes @rendermode="CurrentRenderMode"
                       Kind="RecrovitRoutesKind.Host" />

        @if (CurrentPageDefinition.RouteMode == RecrovitRouteMode.InteractiveServer)
        {
            <ReconnectModal />
        }
    }
    else
    {
        <BlazorApp.Client.Routes @rendermode="CurrentRenderMode" />
    }

    <script src="@Assets["_framework/blazor.web.js"]"></script>
</body>

@inject RecrovitRouteModeResolver RecrovitRouteModeResolver

@code {
    [CascadingParameter]
    private HttpContext? HttpContext { get; set; }

    private RecrovitPageRouteDefinition CurrentPageDefinition
        => RecrovitRouteModeResolver.Resolve(HttpContext?.Request.Path.Value);

    private IComponentRenderMode? CurrentRenderMode
        => RecrovitRouteModeMapper.GetDefaultTopLevelRenderMode(CurrentPageDefinition.RouteMode);
}

Replace BlazorApp.Client with the Client project namespace.

The Client uses the built-in SessionAuth endpoint configuration together with the host base address supplied in Program.cs, so the required Client setup is complete with the code above.

Runtime result

After configuration:

  • Protected Client routes validate the authenticated host session through SessionAuth.
  • Principal state is reconstructed from the host authentication endpoints.
  • RecroGrid Framework calls use the host origin and the integrated downstream proxy path.
  • Server-routed and Client-routed pages use their registered render modes through the shared application root.

Next step