ASP.NET Core Blazor フォームの検証

• カスタムルール、非同期ルール、入れ子になったオブジェクト検証、ローカライズなど、モデルベースの検証ルールの記述と構成については、ASP.NET Coreの検証を参照してください。
• 静的サーバー側レンダリング (静的 SSR) でのライブ ブラウザー検証については、静的 SSR のクライアント側フォーム検証 ASP.NET Core Blazor参照してください。
• 検証コンポーネントとリモート検証の完全な実装については、高度なフォーム検証 ASP.NET Core Blazor参照してください。

• モデルベースの検証規則と入れ子になったオブジェクトの検証の記述と構成については、ASP.NET Coreの検証を参照してください。
• 検証コンポーネントとリモート検証の完全な実装については、高度なフォーム検証 ASP.NET Core Blazor参照してください。

• 検証コンポーネントとリモート検証の完全な実装については、高度なフォーム検証 ASP.NET Core Blazor参照してください。

静的 SSR フォームポストの場合は、一意の FormName を割り当て、 [SupplyParameterFromForm]でポストされたモデルを受け取ります。

<EditForm Model="Model" FormName="starship" OnValidSubmit="Submit">
    ...
</EditForm>

@code {
    [SupplyParameterFromForm]
    private Starship? Model { get; set; }

    protected override void OnInitialized() => Model ??= new();
}

フォームの送信とレンダリング モード間でのモデル バインディングの詳細については、BlazorおよびASP.NET Core フォームのバインディングを参照してください。

静的 SSR フォームでは、静的 SSR での ASP.NET Core のクライアント側フォーム検証Blazorにより、ブラウザーからのライブ フィードバックを提供できます。 フォームは、投稿時にサーバー上で再び権限を持って検証されます。

静的 SSR フォームは、投稿時にサーバー上で検証され、要求間のライブ フィールド検証は提供されません。

データ注釈の検証を構成する

DataAnnotationsValidator では、フォームの DataAnnotations 検証が常に有効になります。 Microsoft.Extensions.Validation パッケージによって提供される拡張検証機能を使用するには、Program ファイルでAddValidation拡張メソッドを呼び出します。

builder.Services.AddValidation();

AddValidation呼び出しは、パッケージの検証サービスを登録し、検出されたモデルの種類の検証メタデータを作成するソース ジェネレーターをアクティブにします。 使用可能な動作は、そのメタデータにフォームのモデルが含まれているかどうかによって異なります。

ValidatableTypeAttribute API とSkipValidationAttribute API は、.NET 10 で試験段階にあります。 詳細と使用可能な回避策については、ASP.NET Coreでの検証に関するページを参照してください。

Microsoft.Extensions.Validation を使用する場合は、Razor コンポーネント ファイル (.cs) ではなく、C# ファイル (.razor) でモデル型を宣言します。 ソース ジェネレーターは C# ソースから検証メタデータを作成し、 Razor コンポーネントで宣言されたモデル型を含めることはできません。

構成要件、検証順序、カスタム ルール、入れ子になったオブジェクト グラフ、生成されたメタデータについては、ASP.NET Coreの検証を参照してください。

入れ子になったオブジェクト グラフを検証する

.NET 9 以前では、DataAnnotationsValidatorは最上位レベルのモデル プロパティを検証しますが、コレクションプロパティや複合型プロパティは再帰的に検証しません。 再帰的検証の場合は、試験的なMicrosoft.AspNetCore.Components.DataAnnotations.ValidationパッケージのObjectGraphDataAnnotationsValidatorと[ValidateComplexType]を使用します。

<EditForm Model="Model" OnValidSubmit="Submit">
    <ObjectGraphDataAnnotationsValidator />
    ...
</EditForm>

public class Starship
{
    [ValidateComplexType]
    public ShipDescription Description { get; set; } =
        new ShipDescription();
}

パッケージは、これらのフレームワーク バージョンでは試験段階のままです。

[CompareProperty] 属性

.NET 5 以前の場合は、CompareAttributeではなく実験用パッケージのComparePropertyAttributeを使用します。 ComparePropertyAttribute は、フィールドと完全なフォームの検証中に一貫して検証結果をフィールドに関連付けます。

モデル ベースのカスタム 規則を記述する

組み込み属性でルールを表現できない場合は、カスタム ValidationAttribute または IValidatableObjectを使用します。 詳細なガイダンスについては、ASP.NET Coreでの検証を参照してください。

モデル ベースのカスタム 規則を記述する

組み込み属性でルールを表現できない場合は、 カスタム検証属性 を使用するか、 IValidatableObjectを実装します。 どちらもDataAnnotationsValidatorを介して行われます。

カスタム属性から ValidationResult を返す場合は、検証済みのメンバー名を含めると、そのフィールドの ValidationMessage コンポーネントに結果が表示されます。

カスタム属性は、 GetServiceを介して登録済みサービスを解決できます。

静的 SSR では、要求間のライブ .NET フィールド検証は提供されません。

非同期のフル フォーム検証の場合は、OnValidationRequested ハンドラーからe.AddAsyncValidatorを呼び出します。 対話型フォームでの非同期フィールド検証の場合は、OnFieldChanged ハンドラーからEditContext.RegisterAsyncFieldValidatorを呼び出します。 同じフィールドに対する新しい非同期検証は、前のフィールドよりも優先され、取り消されます。

モデルベースの非同期検証属性については、「ASP.NET Coreの検証」を参照してください。 完全な再利用可能な検証コンポーネントについては、高度なフォーム検証 ASP.NET Core Blazor参照してください。

非同期フィールド検証を使用する入力では、対応する状態が適用されている間、validまたはinvalidではなく、pendingまたはfaulted (必要に応じてmodifiedを使用) が使用されます。

入力コンポーネントに適用されるクラスを変更するには、 FieldCssClassProviderから派生します。

using Microsoft.AspNetCore.Components.Forms;

public sealed class BootstrapFieldCssClassProvider : FieldCssClassProvider
{
    public override string GetFieldCssClass(
        EditContext editContext,
        in FieldIdentifier fieldIdentifier)
    {
        if (!editContext.IsModified(fieldIdentifier))
        {
            return string.Empty;
        }

        return editContext.IsValid(fieldIdentifier)
            ? "is-valid"
            : "is-invalid";
    }
}

using System.Linq;
using Microsoft.AspNetCore.Components.Forms;

public sealed class BootstrapFieldCssClassProvider : FieldCssClassProvider
{
    public override string GetFieldCssClass(
        EditContext editContext,
        in FieldIdentifier fieldIdentifier)
    {
        if (!editContext.IsModified(fieldIdentifier))
        {
            return string.Empty;
        }

        return editContext.GetValidationMessages(fieldIdentifier).Any()
            ? "is-invalid"
            : "is-valid";
    }
}

カスタム FieldCssClassProvider は、各フィールドの完全なクラス値を決定します。 フォームで非同期フィールド検証を使用する場合は、保留中または障害が発生したクラスが必要な場合に、プロバイダーで IsValidationPending(fieldIdentifier) と IsValidationFaulted(fieldIdentifier) を処理します。

フォームの EditContextにプロバイダーを割り当てます。

editContext.SetFieldCssClassProvider(
    new BootstrapFieldCssClassProvider());

カスタム入力マークアップの場合は、 FieldCssClass を呼び出して、現在のプロバイダーによって選択されたクラスを取得します。

EditFormにモデルが割り当てられると、その子コンテンツは生成されたEditContextを受け取ります。 Context パラメーターを使用してコンテキストをキャプチャし、FieldCssClassを呼び出して、フィールドのクラスを周囲のマークアップに適用します。

<EditForm Model="Model" Context="editContext">
    <DataAnnotationsValidator />

    <div class="@editContext.FieldCssClass(
        () => Model.Identifier)">
        <InputText @bind-Value="Model.Identifier" />
        <ValidationMessage For="() => Model.Identifier" />
    </div>
</EditForm>

IsValid(field)を使用して、フィールドに現在検証メッセージがあるかどうかを判断します。

フィールドの場合、メッセージがないかどうかを !editContext.GetValidationMessages(field).Any()で確認できます。

@{
    var identifier = editContext.Field(nameof(Starship.Identifier));
}

@if (editContext.IsModified(identifier) &&
    !editContext.IsValid(identifier))
{
    <p>Correct the identifier before continuing.</p>
}

@{
    var identifier = editContext.Field(nameof(Starship.Identifier));
}

@if (editContext.IsModified(identifier) &&
    editContext.GetValidationMessages(identifier).Any())
{
    <p>Correct the identifier before continuing.</p>
}

非同期フィールドの検証には、 IsValidationPending(field) と IsValidationFaulted(field) を使用します。 パラメーターなしのメソッドは、フォーム レベルの ValidateAsync パスを記述し、すべてのフィールドの状態を集計するわけではありません。

これらの状態には、 DataAnnotationsValidatorによって実行される非同期作業も含まれます。 プロパティに適用される AsyncValidationAttribute は、既定の pending や faulted CSS クラスなど、フィールドの検証中にフィールドの状態を使用します。 ValidateAsync中、非同期属性とIAsyncValidatableObjectは、パラメーターなしのメソッドによって報告されるフォーム レベルの状態に影響します。

ライブ保留インジケーターには、対話型レンダリング モードが必要です。 静的 SSR フォームの投稿中に、応答がレンダリングされる前にサーバー側の検証が完了します。

EditFormは、OnValidSubmitまたはOnInvalidSubmitを呼び出す前にValidateAsyncを使用するため、同期検証コントロールと非同期検証コントロールを待機します。 OnSubmitを処理する場合は、フォームを処理する前にValidateAsyncを呼び出します。

<EditForm EditContext="editContext" OnSubmit="HandleSubmit">
    ...
</EditForm>

@code {
    private async Task HandleSubmit(EditContext editContext)
    {
        if (await editContext.ValidateAsync())
        {
            await SaveAsync();
        }
    }
}

同期Validateメソッドは、.NET 11 では使用されていません。 非同期検証は待機せず、ハンドラーが非同期作業を登録しようとするとスローされます。

対話型フォームの場合、フォーム レベルの保留中の状態を使用して、 ValidateAsync の実行中に送信を無効にすることができます。

<button type="submit" disabled="@editContext.IsValidationPending()">
    Save
</button>

OnSubmitを処理する場合は、フォームを処理する前にValidateを呼び出します。

<EditForm EditContext="editContext" OnSubmit="HandleSubmit">
    ...
</EditForm>

@code {
    private void HandleSubmit(EditContext editContext)
    {
        if (editContext.Validate())
        {
            Save();
        }
    }
}

• ASP.NET Coreでの検証

• ASP.NET Core の静的 SSR におけるクライアント側フォーム検証Blazor