Blazor状態管理の基本:UserStateサービスの設計と活用方法|ASP.NET×Blazor入門 8.3
8.3 状態管理サービスの設計例
Blazorアプリにおいて、ユーザーの状態やアプリケーション内で共有したいデータを保持する方法として「状態管理サービス」がよく使われます。 特に、ScopedまたはSingletonライフタイムでサービスを登録し、DIを通じて注入・活用する方法が一般的です。
例:ユーザー状態を保持するUserStateサービス
たとえば、ログイン中のユーザー名を管理したい場合、以下のような状態管理クラスを作成します:
// UserState.cs
public class UserState
{
public string? UserName { get; set; }
public bool IsLoggedIn => !string.IsNullOrEmpty(UserName);
}
DIコンテナへの登録
Program.csまたはStartup.cs内で、AddScopedを使って登録します:
// Program.cs
builder.Services.AddScoped<UserState>();
コンポーネント側での使用
状態サービスは、任意のコンポーネントにインジェクトして利用できます:
@inject UserState UserState
@if (UserState.IsLoggedIn)
{
<p>Welcome, @UserState.UserName!</p>
}
else
{
<p>Please log in.</p>
}
状態の更新と再描画
状態が変更された際に、コンポーネントを再描画する必要があります。これは、 StateHasChanged()を呼び出すことで手動で行うか、イベントやObservableパターンで通知する方法もあります。
注意点:ページ遷移時の保持と破棄
- Scopedサービスは、Blazor Serverではユーザーごとに保持されますが、WASMではアプリ全体で一つになります。
- 必要に応じて、状態の初期化や破棄処理も検討しましょう。
状態管理サービスを使うことで、ページ間での状態共有や、コンポーネントをまたぐデータの一貫性を保つことができます。
次は、Blazor WebAssemblyとServerのアーキテクチャ的な違いを解説する 「第9章:Blazor WebAssemblyとServerの違い」へと進みます。
下田 昌平
開発に関するインプットをアウトプットしています。検索ログ
開発・技術相談
システム開発や技術検証、要件定義の作成、アーキテクチャ設計、 テスト設計、運用設計まで、一気通貫で支援しています。 企画段階の「まず相談したい」レベルから、実装・運用まで 幅広く対応できますので、お気軽にお問い合わせください。
お問い合わせ