目次
Bean Validationを使用して入力チェックを実装する方法
「Spring Boot」でWebアプリケーションを作成する時、簡単に入力チェックが出来る方法があります。それが「Bean Validation」です。「Bean Validation」とはJavaBeansで簡単に入力チェックを行う仕組みです。
スポンサーリンク
本記事では「Bean Validation」を使用した入力チェックの方法を紹介します。
ディレクトリ構成
プロジェクトのディレクトリ構造は以下の通り。
springSample └── src └── main ├── java │ └── com │ └── example │ └── demo │ ├── controller │ │ └── UserController.java │ └── dto │ └── UserRequest.java └── resources ├── templates │ └── user │ └── add.html └── static └── css └── add.css
Bean Validationで入力チェックを実装
データを格納する箱である「Data Transfer Object」を作成し、アノテーションを使用して入力チェックする内容を定義します。※本来エラーメッセージは、メッセージファイル等で管理しますが、本記事ではハードコーディングしています。
入力チェック内容は以下の通り。
- 名前:必須、100桁以内
- 住所:255桁以内
- 電話番号:電話番号形式チェック
Bean Validationで定義するよく使うアノテーションは以下の通り。
アノテーション種類 | チェック内容 |
@NotNull | 必須チェック(NULLの場合NG) |
@NotEmpty | 必須チェック(NULL、空文字の場合NG) |
@NotBlank | 必須チェック(NULL、空文字、空白のみの場合NG) |
@Size | 桁数チェック |
@Pattern | 正規表現チェック |
[UserRequest.java]
package com.example.demo.dto; import java.io.Serializable; import javax.validation.constraints.NotEmpty; import javax.validation.constraints.Pattern; import javax.validation.constraints.Size; import lombok.Data; /** * ユーザー情報 リクエストデータ */ @Data public class UserRequest implements Serializable { /** * 名前 */ @NotEmpty(message = "名前を入力してください") @Size(max = 100, message = "名前は100桁以内で入力してください") private String name; /** * 住所 */ @Size(max = 255, message = "住所は255桁以内で入力してください") private String address; /** * 電話番号 */ @Pattern(regexp = "0\d{1,4}-\d{1,4}-\d{4}", message = "電話番号の形式で入力してください") private String phone; }
Controllerでエラー内容を画面に返却する
フロントエンドとサーバーエンドの入出力の管理を行うControllerクラスを作成します。
[UserController]
package com.example.demo.controller; import java.util.ArrayList; import java.util.List; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.validation.BindingResult; import org.springframework.validation.ObjectError; import org.springframework.validation.annotation.Validated; import org.springframework.web.bind.annotation.ModelAttribute; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; import com.example.demo.dto.UserRequest; /** * ユーザー情報 Controller */ @Controller public class UserController { /** * ユーザー新規登録画面を表示 * @param model Model * @return ユーザー情報一覧画面 */ @RequestMapping(value = "/user/add", method = RequestMethod.GET) public String displayAdd(Model model) { model.addAttribute("userRequest", new UserRequest()); return "user/add"; } /** * ユーザー新規登録 * @param userRequest リクエストデータ * @param model Model * @return ユーザー情報一覧画面 */ @RequestMapping(value="/user/create", method=RequestMethod.POST) public String create(@Validated @ModelAttribute UserRequest userRequest, BindingResult result, Model model) { if (result.hasErrors()) { List<String> errorList = new ArrayList<String>(); for(ObjectError error : result.getAllErrors()) { errorList.add(error.getDefaultMessage()); } model.addAttribute("validationError", errorList); return "user/add"; } // ユーザー情報の登録 userService.create(userRequest); return "redirect:/user/list"; } }
createメソッドの引数BindingResultに「Bean Validation」のエラー内容が設定されます。エラーがある場合はhasErrorsがtrueになるので、エラー内容をリストに詰めて画面側に返却します。
スポンサーリンク
HTMLでエラー内容を画面に表示する
画面のHTMLを作成します。
[add.html]
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"> <head> <title>ユーザー新規登録</title> <link href="/css/add.css" rel="stylesheet"></link> <meta charset="utf-8" /> </head> <body> <table> <tr th:if="${validationError}" th:each="error : ${validationError}"> <td style="color:red;" th:text="${error}"></td> </tr> </table> <h1>ユーザー新規登録</h1> <form th:action="@{/user/create}" th:object="${userRequest}" th:method="post"> <a href="/user/list">キャンセル</a> <table> <tr> <th class="cell_title">名前</th> <th class="cell_required">※</th> <td><input type="text" th:field="*{name}"></td> </tr> <tr> <th class="cell_title">住所</th> <th class="cell_required"></th> <td><input type="text" th:field="*{address}"></td> </tr> <tr> <th class="cell_title">電話番号</th> <th class="cell_required"></th> <td><input type="text" th:field="*{phone}"></td> </tr> </table> <div class="btn_area_center"><input type="submit" value="登録" class="btn"></div> </form> </body> </html>
[add.css]
body { width: 80%; } table{ width: 100%; border-collapse: collapse; font-size: 13px; } table th, table td { border: 1px solid #ddd; padding: 6px; } table th { background-color: #F2F2F2; } table input { width:90%; } .cell_title { border-right: 0; } .cell_required{ color: red; font-size: 12px; width: 10px; border-left: 0; } .btn { width: 100px; text-align: center; } .btn_area_center { margin-top: 20px; text-align: center; }
Webアプリケーションを実行して動作確認
1. 登録画面の表示
Spring Bootプロジェクトを実行して http://localhost:8080/user/add へアクセスします。
2. 登録画面にデータを入力し登録
ユーザー新規登録画面が表示されるので、以下の内容を入力して「登録」ボタンを押下します。
- 名前:未入力
- 住所:255桁より大きい値
- 電話番号:電話番号形式ではない値
3. エラーメッセージが表示されることを確認
入力チェックが正常に動作して、想定通りのエラーメッセージが表示されることを確認します。
画面上部に赤字で「Bean Validation」でエラーになった項目に対するエラーメッセージが表示されます。