Blazor ムービーデータベースアプリを構築する (パート 5 - 検証を追加する)

2024-11-12

Note

これは、この記事の最新バージョンではありません。現在のリリースについては、この記事の .NET 9 バージョンを参照してください。

重要

この情報はリリース前の製品に関する事項であり、正式版がリリースされるまでに大幅に変更される可能性があります。 Microsoft はここに示されている情報について、明示か黙示かを問わず、一切保証しません。

現在のリリースについては、この記事の .NET 9 バージョンを参照してください。

この記事は、映画データベースを管理する機能を備えた ASP.NET Core Blazor Web アプリの構築の基本について説明する、Blazor Web App 映画データベースアプリチュートリアルの第 5 部です。

チュートリアルシリーズのこのパートでは、Movie モデルのメタデータを使用して、ムービーを作成および編集するフォームでのユーザーによる入力を検証する方法について説明します。

データ注釈を使用する検証

検証規則は、データ注釈を使用してモデルクラスで指定されます。次の一覧は、フォームのモデル内のパブリックプロパティのユーザーによる入力検証の System.ComponentModel.DataAnnotations 属性の一部を示しています。

[Required]: ユーザーが値を提供する必要があります。
[StringLength]: 文字の最小長と最大長を指定します。属性に渡された MinimumLength では、文字列は必須になりません ( [Required] 属性を適用します)。
[RegularExpression]: ユーザーの入力に一致するパターンを指定します。
[Range]: 最小値と最大値を指定します。

decimal、int、float、DateOnly、TimeOnly、DateTime などの値の型はもともと必須です。値の型に [Required] 属性を配置する必要はありません。

フォームで使用できるその他のデータ注釈については、Blazor リファレンスドキュメントをご覧ください。

`Movie` モデルに検証を追加する

Movie クラスプロパティに次のデータ注釈を追加します。すべてのプロパティを一度に更新するには、次のコード例の後に表示される Models/Movie.cs ファイル全体をコピーして貼り付けます。

+ [Required]
+ [StringLength(60, MinimumLength = 3)]
  public string? Title { get; set; }

+ [Required]
* [StringLength(30)]
+ [RegularExpression(@"^[A-Z]+[a-zA-Z()\s-]*$")]
  public string? Genre { get; set; }

+ [Range(0, 100)]
  [DataType(DataType.Currency)]
  [Column(TypeName = "decimal(18, 2)")]
  public decimal Price { get; set; }

前のデータ注釈の後の Models/Movie.cs ファイルがプロパティに適用されます。

using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;

namespace BlazorWebAppMovies.Models;

public class Movie
{
    public int Id { get; set; }

    [Required]
    [StringLength(60, MinimumLength = 3)]
    public string? Title { get; set; }

    public DateOnly ReleaseDate { get; set; }

    [Required]
    [StringLength(30)]
    [RegularExpression(@"^[A-Z]+[a-zA-Z()\s-]*$")]
    public string? Genre { get; set; }

    [Range(0, 100)]
    [DataType(DataType.Currency)]
    [Column(TypeName = "decimal(18, 2)")]
    public decimal Price { get; set; }
}

前の検証規則はデモンストレーションのためだけに使用されており、実稼働システムには適していません。たとえば、前の検証では、1 文字か 2 文字のみのムービーを入力することはできず、ムービージャンルで追加の特殊文字は使えません。

EF Core 移行を作成してデータベースを更新する

データモデルスキーマは、リレーショナルデータベース内でのデータの編成と接続方法を定義します。

前のセクションの Movie クラスにデータ注釈を追加しても、データベースのスキーマに一致する変更は自動的には行われません。

Title プロパティに適用された注釈を確認します。

[Required]
[StringLength(60, MinimumLength = 3)]
public string? Title { get; set; }

モデルプロパティとデータベースのスキーマの違いを次の表にまとめます。データ注釈が Movie モデルに適用された後は、どちらの制約も一致しません。

制約	モデル `Title` プロパティ	データベース `Title` 列
Maximum length	60 文字	最大 2 GB のバイトペア† `NVARCHAR (MAX)`
必須	はい `[Required]`	いいえ `NULL` は列で許可されます。

†データベース文字列は、サイズ (バイトペア) によって定義されます。 Unicode 範囲 0 から 65,535 で定義されている文字には、文字ごとに 1 バイトペアが使用されます。ただし、その Unicode 範囲外の個々の文字は、格納するために複数のバイトペアを使用するため、列に格納できる実際の文字数は任意です。 Title モデルの Movie プロパティと Title 列のデータベーススキーマを比較する際の重要な概念は、データベースに格納されているバイトペアの最大 2 GB がプロパティに設定されている 60 文字の制限をはるかに超えているということです。データベーススキーマは、アプリの制約に合わせて下方向に調整する必要があります。

アプリの Movie モデルの Title プロパティの長さを一致させるために、データベースは NVARCHAR (60) 列のサイズの Title を示す必要があります。 60 文字のムービータイトルを投稿するユーザーがムービータイトルのデータベースの最大 2 GB バイトペアの制限内に収まるため、アプリを使用するときに、スキーマの違いにより、EF Core が例外をスローすることはありません。ただし、モデルプロパティにデータベースで許可されている制約よりも大きい制約が与えられ、ユーザーがデータベース文字列に対して長すぎる文字列を投稿する逆の状況では、データベースによって例外がスローされるか、あるいはユーザーが値をポストするとデータが切り捨てられます。スキーマが正しく配置されていないと、例外が発生し、不適切なデータが格納される可能性があるため、アプリのモデルは常にデータベースのスキーマに合わせて維持する必要があります。

Title プロパティは、型 (?) の string で示されているように、string? ですが、モデルの NULL 制約のため、データベースは Title 列に Required 値を格納しないでください。次の手順でデータベースのスキーマが更新されると、データベースの Title 列には、プロパティと一致する NOT NULL 列の Title が反映されている必要があります。重要な概念は、モデルプロパティが NRT であり、コードで null 値を保持できるからといって、データベース列のスキーマが Null 許容 (NULL 許可) であることを意味するものではありません。これらはさまざまな目的で使用される独立した条件です。NRT は Null 許容型のコーディングエラーを防ぐために使用され、データベーススキーマは格納されているデータの正確な型とサイズを反映します。

モデルとデータベーススキーマを合わせるには、移行の変更を識別する移行名で EF Coreデータベース移行を作成して適用します。移行名は、バージョン管理システムのコミットメッセージと似ています。次のコマンドの例では、移行名 "NewMovieDataAnnotations" は、新しいデータ注釈が Movie モデルに追加されたことを反映しています。

重要

次の手順でアプリが実行されていないことを確認します。

Visual Studio を使用しているときにアプリを停止するには、ブラウザーのウィンドウを閉じる必要があるだけです。

VS Code を使用する場合は、ブラウザーのウィンドウを閉じて、[Run]、> を選択するか、キーボードの Shift+ キーを押して、VS Code でアプリを停止します。

.NET CLI を使用する場合は、ブラウザーのウィンドウを閉じ、Ctrl +Cコマンドシェルでアプリを停止します。

Visual Studio のソリューションエクスプローラーで、[接続済みサービス] をダブルクリックします。 [サービスの依存関係] 領域で省略記号 (...) を選択したあと、[SQL Server Express LocalDB] 領域で [移行の追加] を選択します。

移行を説明するのNewMovieDataAnnotationsを移行に付けます。データベースコンテキストが [DbContext クラス名] フィールドに読み込まれるのを待ちます。 [完了] を選択して移行を作成します。操作が完了したら、[閉じる] ボタンを選択します。

省略記号 (...) をもう一度選択し、次に [データベースの更新] コマンドを選択します。

[データベースを最新の移行で更新] ダイアログが開きます。 [DbContext クラス名] フィールドが更新され、以前の移行が読み込まれるまで待ちます。 [完了] ボタンを選択します。操作が完了したら、[閉じる] ボタンを選択します。

[ターミナル] ([ターミナル] メニュー、>) で次のコマンドを使用して、新しいデータ注釈の移行を追加します。

dotnet ef migrations add NewMovieDataAnnotations

データベースに移行を適用するには、次のコマンドを実行します。

dotnet ef database update

新しいデータ注釈の移行を追加するには、プロジェクトのルートフォルダーに対して開かれたコマンドシェルで、次のコマンドを実行します。

dotnet ef migrations add NewMovieDataAnnotations

データベースに移行を適用するには、次のコマンドを実行します。

dotnet ef database update

次の表にまとめられているように、移行を適用した後、モデルプロパティとデータベースのスキーマが一致します。

制約	モデル `Title` プロパティ	データベース `Title` 列
Maximum length	60 文字	60 バイトペアが許可されます†。 `NVARCHAR (60)`
必須	はい `[Required]`	はい `NOT NULL` は列に対して示されます。

†1 文字ごとに 1 バイトペアを使用して映画のタイトルを格納する場合、60 バイトペアは 60 文字です。これは、Unicode の範囲 0 から 65,535 で定義された文字を使用する場合に当てはまります。

完成したサンプルを使用したトラブルシューティング

チュートリアルの実行中にテキストから解決できない問題が発生した場合は、コードを、 Blazor サンプルリポジトリの完成したプロジェクトと比較します。

Blazor サンプル GitHub リポジトリ (dotnet/blazor-samples)

最新バージョンのフォルダーを選択します。このチュートリアルのプロジェクトのサンプルフォルダーには、BlazorWebAppMovies という名前が付けられています。

その他のリソース

次のステップ

前へ:データベースの操作次へ:検索の追加

次の方法で共有

Blazor ムービー データベース アプリを構築する (パート 5 - 検証を追加する)

データ注釈を使用する検証

Movie モデルに検証を追加する

EF Core 移行を作成してデータベースを更新する

完成したサンプルを使用したトラブルシューティング

その他のリソース

次のステップ

フィードバック

その他のリソース

Blazor ムービーデータベースアプリを構築する (パート 5 - 検証を追加する)

`Movie` モデルに検証を追加する