Blazor Serverでリンクで遷移するページ間で変数を共有する

親と子コンポーネントによるパラメータやり取りはBlazorの醍醐味で入門書通りできると思います。ここではリンクで遷移したページ間で変数を共有する方法を掲載します。

データクラスの準備

例としてプロパティが一つしかない単純な UserSessionServiceクラス を準備します。

UserSessionService.cs

    public class UserSessionService
    {
        public string UserData { get; set; } = "2600";

    }

初期値は2600にしました（なんとなく）

Program.csを編集

自動生成されたアセットのProgram.csは以下のようになっていると思います。
ここに　builder.Services.AddScoped();　を追記します。

Program.cs

using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web;

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorPages();
builder.Services.AddServerSideBlazor();
builder.Services.AddSingleton<WeatherForecastService>();

builder.Services.AddScoped<UserSessionService>();// ←←　◆追記する◆

var app = builder.Build();

詳しくは調べていませんが、例のような単純な値クラスではなく少し複雑なクラスで試したときはbuilder.Build()でエラーが発生しました。

元ページ(Page1)

＠inject UserSessionService UserSession　と上部に記述するとUserSessionという名前のインスタンスが使えるようになるイメージです。
inputにUserSessionをバインドし、1文字入力するたびにバインドが反映するように記述します。
page2にリンクで飛びましょう

Page1.cs

@page "/page1"
@inject UserSessionService UserSession

<h3>Page 1</h3>

<p>@UserSession.UserData</p>

<input @bind-value="UserSession.UserData" @bind-value:event="oninput" />

<a href="/page2">Go to Page 2</a>

リンク先ページ(Page2)

Page1同様に上部にinjectの記述をします。
リンクで遷移するとPage1のinputに入力した文字が表示されていると思います。

Page2.cs

@page "/page2"
@inject UserSessionService UserSession

<h3>Page 2</h3>

<p>@UserSession.UserData</p>

使いどころ

Blazorはシングルページアプリケーションなのであまりリンクを使って遷移することはないと思うのですが、アセット画面の左側のナビゲーションにユーザIDを入力して、そのまま他のページでも使い回せたらいいな　みたいなことがありましたのでこのような方法が出来るかを試してみました。

ここまで読んでいただきありがとうございました。