| (同じ利用者による、間の1版が非表示) | |||
| 441行目: | 441行目: | ||
404エラー等のルーティングエラーは、App.razorで設定したNotFoundテンプレートによって処理される。<br> | 404エラー等のルーティングエラーは、App.razorで設定したNotFoundテンプレートによって処理される。<br> | ||
これにより、ユーザフレンドリーなエラー画面を表示することが可能である。<br> | これにより、ユーザフレンドリーなエラー画面を表示することが可能である。<br> | ||
<br> | |||
例えば、NotFoundセクションをカスタマイズすることにより、より使用しやすいエラー画面を提供することができる。<br> | |||
<br> | |||
<syntaxhighlight lang="c#"> | |||
// App.razorファイル | |||
<Router AppAssembly="@typeof(App).Assembly"> | |||
<Found Context="routeData"> | |||
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" /> | |||
</Found> | |||
<NotFound> | |||
<PageTitle>Not found</PageTitle> | |||
<LayoutView Layout="@typeof(MainLayout)"> | |||
<div class="alert alert-danger"> | |||
<h3>ページが見つかりません</h3> | |||
<p>申し訳ありません。要求されたページは存在しません。</p> | |||
<a href="/" class="btn btn-primary">ホームに戻る</a> | |||
</div> | |||
</LayoutView> | |||
</NotFound> | |||
</Router> | |||
</syntaxhighlight> | |||
<br> | |||
==== カスタム404ページ ==== | |||
<syntaxhighlight lang="c#"> | |||
// Pages/CustomNotFound.razorファイル | |||
@inject NavigationManager NavigationManager | |||
<div class="error-container"> | |||
<h2>404 - ページが見つかりません</h2> | |||
<p>リクエストされたURL: @NavigationManager.Uri</p> | |||
<div class="error-actions"> | |||
<button @onclick="GoBack">前のページに戻る</button> | |||
<a href="/" class="btn">ホームページへ</a> | |||
</div> | |||
</div> | |||
@code { | |||
private void GoBack() | |||
{ | |||
NavigationManager.NavigateTo(NavigationManager.Uri); | |||
} | |||
} | |||
</syntaxhighlight> | |||
<br> | |||
上記のファイルをApp.razorファイルで使用する。<br> | |||
<syntaxhighlight lang="c#"> | |||
// App.razorファイル | |||
<NotFound> | |||
<LayoutView Layout="@typeof(MainLayout)"> | |||
<CustomNotFound /> | |||
</LayoutView> | |||
</NotFound> | |||
</syntaxhighlight> | |||
<br><br> | <br><br> | ||
== 認証 / 認可 == | == 認証 / 認可 == | ||
<code>[Authorize]</code>属性を使用することにより、特定のルートへのアクセスを制限することができる。<br> | <code>[Authorize]</code>属性を使用することにより、特定のルートへのアクセスを制限することができる。<br> | ||
<br> | |||
==== 基本的な認証要求 ==== | |||
<syntaxhighlight lang="c#"> | |||
@page "/secured-page" | |||
[Authorize] | |||
public class SecuredPageBase : ComponentBase | |||
{ | |||
// このページは認証済みユーザーのみアクセス可能 | |||
} | |||
</syntaxhighlight> | |||
<br> | |||
==== 特定のロールに基づく認証 ==== | |||
<syntaxhighlight lang="c#"> | |||
@page "/admin-page" | |||
[Authorize(Roles = "Admin")] | |||
public class AdminPageBase : ComponentBase | |||
{ | |||
// 管理者ロールを持つユーザーのみアクセス可能 | |||
} | |||
</syntaxhighlight> | |||
<br> | |||
==== 複数のロールの指定 ==== | |||
<syntaxhighlight lang="c#"> | |||
[Authorize(Roles = "Admin,Manager")] | |||
// ポリシーベースの認証 | |||
[Authorize(Policy = "RequireAdminRole")] | |||
// カスタム認証要件 | |||
[Authorize(Policy = "MinimumAgeRequirement")] | |||
</syntaxhighlight> | |||
<br> | |||
==== Program.csでの認証サービスの設定 ==== | |||
<syntaxhighlight lang="c#"> | |||
builder.Services.AddAuthentication().AddCookie(); | |||
builder.Services.AddAuthorization(options => | |||
{ | |||
options.AddPolicy("RequireAdminRole", policy => policy.RequireRole("Admin")); | |||
options.AddPolicy("MinimumAgeRequirement", policy => policy.Requirements.Add(new MinimumAgeRequirement(18))); | |||
}); | |||
</syntaxhighlight> | |||
<br> | |||
==== 認証状態の確認と処理 ==== | |||
<syntaxhighlight lang="c#"> | |||
@inject AuthenticationStateProvider AuthenticationStateProvider | |||
@code { | |||
private async Task<bool> IsUserAuthenticated() | |||
{ | |||
var authState = await AuthenticationStateProvider.GetAuthenticationStateAsync(); | |||
return authState.User.Identity.IsAuthenticated; | |||
} | |||
} | |||
</syntaxhighlight> | |||
<br><br> | <br><br> | ||