0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【ASP.NET Core MVC】フォームバリデーション完全ガイド

0
Posted at

【ASP.NET Core MVC】フォームバリデーション完全ガイド

DataAnnotations / ModelState / TagHelper / セキュリティ対策

Webアプリケーションにおいて、フォーム入力は最も攻撃されやすいポイントです。
適切なバリデーションを行わないと、次のような問題が発生します。

  • SQLインジェクション
  • クロスサイトスクリプティング(XSS)
  • データ破損
  • 不正リクエスト

この記事では ASP.NET Core MVC のフォームバリデーションを実務レベルで解説します。


この記事で分かること

この記事では以下を理解できます。

  • DataAnnotations を使ったバリデーション
  • ModelState によるサーバー検証
  • TagHelper を使ったフォーム表示
  • クライアントサイドバリデーション
  • セキュリティを意識した入力設計

ASP.NET Core MVC バリデーションの全体構造

ASP.NET Core MVC のバリデーションは次の流れで行われます。

ポイント

  • モデルバインディング時に 自動でバリデーションが実行
  • 結果は ModelState に格納される

DataAnnotations によるバリデーション

ASP.NET Coreでは、モデルに 属性(Attribute) を付けることで
バリデーションルールを定義できます。

例:ユーザー登録モデル

using System.ComponentModel.DataAnnotations;

public class UserRegistrationDto
{
    [Required(ErrorMessage = "ユーザー名は必須です")]
    [StringLength(50, MinimumLength = 3,
        ErrorMessage = "ユーザー名は3文字以上50文字以内で入力してください")]
    public string Username { get; set; }

    [Required(ErrorMessage = "メールアドレスは必須です")]
    [EmailAddress(ErrorMessage = "有効なメールアドレス形式ではありません")]
    public string Email { get; set; }

    [Required(ErrorMessage = "パスワードは必須です")]
    [DataType(DataType.Password)]
    [RegularExpression(@"^(?=.*[a-z])(?=.*[A-Z])(?=.*\d).{8,}$",
        ErrorMessage = "パスワードは英大文字、小文字、数字を含め8文字以上にしてください")]
    public string Password { get; set; }
}

Controller側の検証

Controllerでは ModelState.IsValid をチェックします。

[HttpPost]
public IActionResult Register(UserRegistrationDto model)
{
    if (!ModelState.IsValid)
    {
        return View(model);
    }

    // 正常なデータのみここに到達
    return RedirectToAction("Index");
}

ここが サーバー側の最終防衛ラインになります。


TagHelper を使ったフォーム

ASP.NET Core MVCでは TagHelper を使うことで
バリデーションを簡単に表示できます。

<form asp-action="Register" method="post">

    <div class="form-group">

        <label asp-for="Username"></label>

        <input asp-for="Username" class="form-control"/>

        <span asp-validation-for="Username" class="text-danger"></span>

    </div>

    <button type="submit">登録</button>

</form>

asp-validation-for

このタグは

  • ModelStateエラー
  • クライアント検証エラー

を自動表示します。


クライアントサイドバリデーション

ASP.NET Core MVCでは

  • HTML5 Validation
  • jQuery Validate

と自動連携します。

つまり

  1. クライアント側(UX向上)
  2. サーバー側(安全性保証)

二重バリデーション構造になります。


セキュリティを意識した入力設計

バリデーションは 単なる入力チェックではありません。

セキュリティの観点から重要です。


ホワイトリスト方式

許可する入力のみ定義します。

  • メール形式
  • 英数字
  • 文字数制限

ブラックリスト(禁止文字)は
新しい攻撃に弱いです。


型を活用する

型は強力なバリデータになります。

public int Age { get; set; }

public DateTime BirthDate { get; set; }

型が一致しない場合
自動的に ModelStateエラーになります。


XSS対策

ASP.NET Core MVC では Razor が 自動でHTMLエンコードします。

<p>@Model.Comment</p>

以下は危険です。

@Html.Raw(Model.Comment)

ユーザー入力には使わないようにします。


実務でよくあるミス

よくあるミスをまとめます。

  1. ModelState.IsValid を確認しない
  2. Html.Raw を使う
  3. クライアント検証だけに頼る
  4. 文字列連結SQLを書く

まとめ

ASP.NET Core MVC のフォームバリデーションは

  • DataAnnotations
  • ModelState
  • TagHelper

を組み合わせて実装します。

これにより

  • セキュリティ向上
  • 保守性向上
  • UX向上

を同時に実現できます。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?