[Spring Boot][5] 4-1. 검증1 - Validation

sorzzzzy·2021년 9월 18일

Spring Springboot TIL

Spring Boot - RoadMap 1

목록 보기

39/46

🏷 검증 요구사항

상품 관리 시스템에 새로운 요구사항이 추가되었다

✔️ 요구사항: 검증 로직 추가

타입 검증
- 가격, 수량에 문자가 들어가면 검증 오류 처리
필드 검증
- 상품명: 필수, 공백X
- 가격: 1000원 이상, 1백만원 이하
- 수량: 최대 9999
특정 필드의 범위를 넘어서는 검증
- 가격 * 수량의 합은 10,000원 이상

🏷 프로젝트 설정 V1

이전 프로젝트에 이어서 ❗️검증(Validation) 기능❗️을 학습할 예정.
이전 프로젝트를 일부 수정한 validation-start 라는 프로젝트를 사용할 것이다

📌 validation-start 의 폴더 이름을 validation 로 변경해야 한다!

🏷 검증 직접 처리 - 소개

✔️ 상품 저장 성공

✔️ 상품 저장 검증 실패

🏷 검증 직접 처리 - 개발

✔️ `ValidationItemV1Controller` - `addItem()` 수정

@PostMapping("/add")
    public String addItem(@ModelAttribute Item item, RedirectAttributes redirectAttributes, Model model) {

        // 검증 오류 결과를 보관
        Map<String, String> errors = new HashMap<>();

        // 검증 로직
        if (!StringUtils.hasText(item.getItemName())) {
            // itemName이 없다면 오류메세지 설정
            errors.put("itemName", "상품 이름은 필수입니다.");
        }
        if (item.getPrice() == null || item.getPrice() < 1000 || item.getPrice() > 1000000) {
            errors.put("price", "가격은 1,000 ~ 1,000,000 까지 허용합니다.");
        }
        if (item.getQuantity() == null || item.getQuantity() >= 9999) {
            errors.put("quantity", "수량은 최대 9,999 까지 허용합니다.");
        }

        // 특정 필드가 아닌 복합 룰 검증
        // 특정 필드를 넘어서는 오류를 처리해야 할 수도 있다.
        // 이때는 필드 이름을 넣을 수 없으므로 globalError 라는 key 를 사용한다.
        if (item.getPrice() != null && item.getQuantity() != null) {
            int resultPrice = item.getPrice() * item.getQuantity();
            if (resultPrice < 10000) {
                errors.put("globalError", "가격 * 수량의 합은 10,000원 이상이어야 합니다. 현재 값 = " + resultPrice);
            }
        }

        // 검증에 실패하면 다시 입력 폼으로
        // 만약 검증에서 오류 메시지가 하나라도 있으면 오류 메시지를 출력하기 위해 model errors 를 담고,
        // 입력 폼이 있는 뷰 템플릿으로 보낸다.
        if (!errors.isEmpty()) {
            log.info("errors = {} ", errors);
            model.addAttribute("errors", errors);
            return "validation/v1/addForm";
        }

        //성공 로직
        Item savedItem = itemRepository.save(item);
        redirectAttributes.addAttribute("itemId", savedItem.getId());
        redirectAttributes.addAttribute("status", true);
        return "redirect:/validation/v1/items/{itemId}";
    }

1️⃣ 검증 오류 보관

Map<String, String> errors = new HashMap<>();
만약 검증시 오류가 발생하면 어떤 검증에서 오류가 발생했는지 정보를 담아둔다.

2️⃣ 검증 로직

검증 시 오류가 발생하면 errors 에 담아둔다.
이때 어떤 필드에서 오류가 발생했는지 구분하기 위해 오류가 발생한 필드명을 key 로 사용한다.
이후 뷰에서 이 데이터를 사용해서 고객에게 친절한 오류 메시지를 출력할 수 있다.

3️⃣ 특정 필드가 아닌 복합 룰 검증

특정 필드를 넘어서는 오류를 처리해야 할 수도 있다.
이때는 필드 이름을 넣을 수 없으므로 globalError 라는 key 를 사용한다.

4️⃣ 검증에 실패하면 다시 입력 폼으로

만약 검증에서 오류 메시지가 하나라도 있으면 오류 메시지를 출력하기 위해 model errors 를 담고,
입력 폼이 있는 뷰 템플릿으로 보낸다.

✔️ `addForm.html`

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <link th:href="@{/css/bootstrap.min.css}"
          href="../css/bootstrap.min.css" rel="stylesheet">
    <style>
        .container {
            max-width: 560px;
        }
        .field-error {
            border-color: #dc3545;
            color: #dc3545;
        }
    </style>
</head>
<body>

<div class="container">

    <div class="py-5 text-center">
        <h2 th:text="#{page.addItem}">상품 등록</h2>
    </div>

    <form action="item.html" th:action th:object="${item}" method="post">

        <div th:if="${errors?.containsKey('globalError')}">
            <p class="field-error" th:text="${errors['globalError']}">전체 오류 메시지</p>
        </div>

        <div>
            <label for="itemName" th:text="#{label.item.itemName}">상품명</label>
            <input type="text" id="itemName" th:field="*{itemName}"
                   th:class="${errors?.containsKey('itemName')} ? 'form-control field-error' : 'form-control'"
                   class="form-control" placeholder="이름을 입력하세요">
            <div class="field-error" th:if="${errors?.containsKey('itemName')}" th:text="${errors['itemName']}">
                상품명 오류
            </div>
        </div>
        <div>
            <label for="price" th:text="#{label.item.price}">가격</label>
            <input type="text" id="price" th:field="*{price}"
                   th:class="${errors?.containsKey('price')} ? 'form-control field-error' : 'form-control'"
                   class="form-control" placeholder="가격을 입력하세요">
            <div class="field-error" th:if="${errors?.containsKey('price')}" th:text="${errors['price']}">
                가격 오류
            </div>
        </div>

        <div>
            <label for="quantity" th:text="#{label.item.quantity}">수량</label>
            <input type="text" id="quantity" th:field="*{quantity}"
                   th:class="${errors?.containsKey('quantity')} ? 'form-control field-error' : 'form-control'"
                   class="form-control" placeholder="수량을 입력하세요">
            <div class="field-error" th:if="${errors?.containsKey('quantity')}" th:text="${errors['quantity']}">
                수량 오류
            </div>

        </div>

        <hr class="my-4">

        <div class="row">
            <div class="col">
                <button class="w-100 btn btn-primary btn-lg" type="submit" th:text="#{button.save}">상품 등록</button>
            </div>
            <div class="col">
                <button class="w-100 btn btn-secondary btn-lg"
                        onclick="location.href='items.html'"
                        th:onclick="|location.href='@{/validation/v1/items}'|"
                        type="button" th:text="#{button.cancel}">취소</button>
            </div>
        </div>

    </form>

</div> <!-- /container -->
</body>
</html>

📌 글로벌 오류 메시지
<div th:if="${errors?.containsKey('globalError')}">
	<p class="field-error" th:text="${errors['globalError']}">전체 오류 메시지</p>
</div>
➡️ 오류 메시지는 errors 에 내용이 있을 때만 출력하면 된다. 타임리프의 th:if 를 사용하면 조건에 만족할 때만 해당 HTML 태그를 출력할 수 있다!

✔️ 실행 결과

✔️ 정리와 남은 문제점

1️⃣ 정리

만약 검증 오류가 발생하면 입력 폼을 다시 보여준다.
검증 오류들을 고객에게 친절하게 안내해서 다시 입력할 수 있게 한다.
검증 오류가 발생해도 고객이 입력한 데이터가 유지된다.

2️⃣ 남은 문제점

뷰 템플릿에서 중복 처리가 많다.
타입 오류 처리가 안된다
-
- Item의 price에 문자를 입력하는 것 처럼 타입 오류가 발생해도 고객이 입력한 문자를 화면에 남겨야 한다.
- 만약 컨트롤러가 호출된다고 가정해도 Item 의 price 는 Integer 이므로 문자를 보관할 수가 없다.
- 결국 문자는 바인딩이 불가능하므로 고객이 입력한 문자가 사라지게 되고, 고객은 본인이 어떤 내용을 입력해서 오류가 발생했는지 이해하기 어렵다.
➡️ 결국 고객이 입력한 값도 어딘가에 별도로 관리가 되어야 한다❗️

🏷 프로젝트 준비 V2

앞서 만든 기능을 유지하기 위해, 컨트롤러와 템플릿 파일을 복사하자☺️

✔️ `ValidationItemControllerV2` 컨트롤러 생성

- `hello.itemservice.web.validation.ValidationItemControllerV1` 복사
- `hello.itemservice.web.validation.ValidationItemControllerV2` 붙여넣기

URL 경로 변경
- validation/v1/ ➡️ validation/v2/
템플릿 파일 복사
- validation/v1 디렉토리의 모든 템플릿 파일을 validation/v2 디렉토리로 복사
- /resources/templates/validation/v1/ ➡️ /resources/templates/validation/v2/
/resources/templates/validation/v2/ 하위 4개 파일 모두 URL 경로 변경
- validation/v1/ ➡️ validation/v2/

변경 후, 서버를 실행해 잘 동작하는 지 확인하고 다음 단계로 넘어가기😀

🏷 BindingResult1

지금부터 스프링이 제공하는 검증 오류 처리 방법을 알아볼텐데 여기서 핵심은 BindingResult이다❗️

✔️ `ValidationItemControllerV2` - `addItemV1`

    @PostMapping("/add")
    public String addItemV1(@ModelAttribute Item item, BindingResult bindingResult, RedirectAttributes redirectAttributes, Model model) {

        //검증 로직
        if (!StringUtils.hasText(item.getItemName())) {
            bindingResult.addError(new FieldError("item", "itemName", "상품 이름은 필수 입니다."));
        }
        if (item.getPrice() == null || item.getPrice() < 1000 || item.getPrice() > 1000000) {
            bindingResult.addError(new FieldError("item", "price", "가격은 1,000 ~ 1,000,000 까지 허용합니다."));
        }
        if (item.getQuantity() == null || item.getQuantity() >= 9999) {
            bindingResult.addError(new FieldError("item", "quantity", "수량은 최대 9,999 까지 허용합니다."));
        }

        //특정 필드가 아닌 복합 룰 검증
        if (item.getPrice() != null && item.getQuantity() != null) {
            int resultPrice = item.getPrice() * item.getQuantity();
            if (resultPrice < 10000) {
                bindingResult.addError(new ObjectError("item", "가격 * 수량의 합은 10,000원 이상이어야 합니다. 현재 값 = " + resultPrice));
            }
        }

        //검증에 실패하면 다시 입력 폼으로
        if (bindingResult.hasErrors()) {
            log.info("errors={} ", bindingResult);
            return "validation/v2/addForm";
        }

        //성공 로직
        Item savedItem = itemRepository.save(item);
        redirectAttributes.addAttribute("itemId", savedItem.getId());
        redirectAttributes.addAttribute("status", true);
        return "redirect:/validation/v2/items/{itemId}";
    }

FieldError ➡️ ObjectError 로 변경

📌 특정 필드를 넘어서는 오류가 있으면 ObjectError 객체를 생성해서 bindingResult 에 담아둔다

objectName : @ModelAttribute 의 이름

defaultMessage : 오류 기본 메시지

✔️ `validation/v2/addForm.html` 수정

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <link th:href="@{/css/bootstrap.min.css}"
          href="../css/bootstrap.min.css" rel="stylesheet">
    <style>
        .container {
            max-width: 560px;
        }
        .field-error {
            border-color: #dc3545;
            color: #dc3545;
        }
    </style>
</head>
<body>

<div class="container">

    <div class="py-5 text-center">
        <h2 th:text="#{page.addItem}">상품 등록</h2>
    </div>

    <form action="item.html" th:action th:object="${item}" method="post">

        <div th:if="${#fields.hasGlobalErrors()}">
            <p class="field-error" th:each="err : ${#fields.globalErrors()}" th:text="${err}">글로벌 오류 메시지</p>
        </div>

        <div>
            <label for="itemName" th:text="#{label.item.itemName}">상품명</label>
            <input type="text" id="itemName" th:field="*{itemName}"
                   th:errorclass="field-error" class="form-control" placeholder="이름을 입력하세요">
            <div class="field-error" th:errors="*{itemName}">
                상품명 오류
            </div>
        </div>
        <div>
            <label for="price" th:text="#{label.item.price}">가격</label>
            <input type="text" id="price" th:field="*{price}"
                   th:errorclass="field-error" class="form-control" placeholder="가격을 입력하세요">
            <div class="field-error" th:errors="*{price}">
                가격 오류
            </div>
        </div>

        <div>
            <label for="quantity" th:text="#{label.item.quantity}">수량</label>
            <input type="text" id="quantity" th:field="*{quantity}"
                   th:errorclass="field-error" class="form-control" placeholder="수량을 입력하세요">
            <div class="field-error" th:errors="*{quantity}">
                수량 오류
            </div>

        </div>

        <hr class="my-4">

        <div class="row">
            <div class="col">
                <button class="w-100 btn btn-primary btn-lg" type="submit" th:text="#{button.save}">상품 등록</button>
            </div>
            <div class="col">
                <button class="w-100 btn btn-secondary btn-lg"
                        onclick="location.href='items.html'"
                        th:onclick="|location.href='@{/validation/v2/items}'|"
                        type="button" th:text="#{button.cancel}">취소</button>
            </div>
        </div>

    </form>

</div> <!-- /container -->
</body>
</html>

타임리프 스프링 검증 오류 통합 기능

타임리프는 스프링의 BindingResult 를 활용해서 편리하게 검증 오류를 표현하는 기능을 제공한다.
#fields : #fields 로 `BindingResult`` 가 제공하는 검증 오류에 접근할 수 있다.
th:errors : 해당 필드에 오류가 있는 경우에 태그를 출력한다. th:if 의 편의 버전!
th:errorclass : th:field 에서 지정한 필드에 오류가 있으면 class 정보를 추가한다.

1️⃣ 글로벌 오류 처리

<div th:if="${#fields.hasGlobalErrors()}">
      <p class="field-error" th:each="err : ${#fields.globalErrors()}" th:text="$
{err}">전체 오류 메시지</p> 
</div>

2️⃣ 필드 오류 처리

<input type="text" id="itemName" th:field="*{itemName}" th:errorclass="field-error" class="form-control" placeholder="이름을
입력하세요">
<div class="field-error" th:errors="*{itemName}">
상품명 오류
</div>

🏷 BindingResult2

스프링이 제공하는 검증 오류를 보관하는 객체이다.
검증 오류가 발생하면 여기에 보관하면 된다.
BindingResult 가 있으면 @ModelAttribute 에 데이터 바인딩 시 오류가 발생해도 컨트롤러가 호출된다!

@ModelAttribute에 바인딩 시 타입 오류가 발생하면🤔❓

BindingResult 가 없으면 400 오류가 발생하면서 컨트롤러가 호출되지 않고, 오류 페이지로
이동한다.

BindingResult 가 있으면 오류 정보(FieldError)를 BindingResult 에 담아서 컨트롤러를
정상 호출한다.

✔️ BindingResult에 검증 오류를 적용하는 3가지 방법

1️⃣ @ModelAttribute 의 객체에 타입 오류 등으로 바인딩이 실패하는 경우 스프링이 FieldError 생성해서
BindingResult 에 넣어준다.
2️⃣ 개발자가 직접! 넣어준다.
3️⃣ Validator을 사용한다.

주의🤚🏻
BindingResult 는 검증할 대상 바로 다음에 와야한다! (순서 중요)

예를 들어서 @ModelAttribute Item item , 바로 다음에 BindingResult 가 와야 한다.

BindingResult 는 Model에 자동으로 포함된다.

✔️ BindingResult와 Errors

org.springframework.validation.Errors
org.springframework.validation.BindingResult
BindingResult 는 인터페이스이고, Errors 인터페이스를 상속받고 있다.
실제 넘어오는 구현체는 BeanPropertyBindingResult 라는 것인데, 둘다 구현하고 있으므로 BindingResult 대신에 Errors 를 사용해도 된다.
Errors 인터페이스는 단순한 오류 저장과 조회 기능을 제공한다.
BindingResult 는 여기에 더해서 추가적인 기능들을 제공한다.
addError() 도 BindingResult 가 제공하므로 여기서는 BindingResult 를 사용하자❗️
주로 관례상 BindingResult 를 많이 사용한다.

🏷 FieldError, ObjectError

우리의 목표 : 사용자 입력 오류 메시지가 화면에 남도록 만들어보자🤗
➡️ 예) 가격을 1000원 미만으로 설정시 입력한 값이 남아있어야 한다!

✔️ `ValidationItemControllerV2` - `addItemV2`

    @PostMapping("/add")
    public String addItemV2(@ModelAttribute Item item, BindingResult bindingResult, RedirectAttributes redirectAttributes, Model model) {

        //검증 로직
        if (!StringUtils.hasText(item.getItemName())) {
            bindingResult.addError(new FieldError("item", "itemName", item.getItemName(), false, null, null, "상품 이름은 필수 입니다."));
        }
        if (item.getPrice() == null || item.getPrice() < 1000 || item.getPrice() > 1000000) {
            bindingResult.addError(new FieldError("item", "price", item.getPrice(), false, null, null, "가격은 1,000 ~ 1,000,000 까지 허용합니다."));
        }
        if (item.getQuantity() == null || item.getQuantity() >= 9999) {
            bindingResult.addError(new FieldError("item", "quantity", item.getQuantity(), false, null ,null, "수량은 최대 9,999 까지 허용합니다."));
        }

        //특정 필드가 아닌 복합 룰 검증
        if (item.getPrice() != null && item.getQuantity() != null) {
            int resultPrice = item.getPrice() * item.getQuantity();
            if (resultPrice < 10000) {
                bindingResult.addError(new ObjectError("item",null ,null, "가격 * 수량의 합은 10,000원 이상이어야 합니다. 현재 값 = " + resultPrice));
            }
        }

        //검증에 실패하면 다시 입력 폼으로
        if (bindingResult.hasErrors()) {
            log.info("errors={} ", bindingResult);
            return "validation/v2/addForm";
        }

        //성공 로직
        Item savedItem = itemRepository.save(item);
        redirectAttributes.addAttribute("itemId", savedItem.getId());
        redirectAttributes.addAttribute("status", true);
        return "redirect:/validation/v2/items/{itemId}";
    }

주의🤚🏻 - addItemV1() 의 @PostMapping("/add") 을 주석 처리하자!

사실 FieldError 는 두 가지 생성자를 제공한다❗️

 public FieldError(String objectName, String field, String defaultMessage);
 
 public FieldError(String objectName, String field, @Nullable Object
  rejectedValue, boolean bindingFailure, @Nullable String[] codes, @Nullable
  Object[] arguments, @Nullable String defaultMessage)

objectName : 오류가 발생한 객체 이름
field : 오류 필드
rejectedValue : 사용자가 입력한 값(거절된 값)
bindingFailure : 타입 오류 같은 바인딩 실패인지, 검증 실패인지 구분 값
codes : 메시지 코드
arguments : 메시지에서 사용하는 인자
defaultMessage : 기본 오류 메시지

✔️ 오류 발생 시 사용자 입력 값 유지

new FieldError("item", "price", item.getPrice(), false, null, null, "가격은 1,000 ~ 1,000,000 까지 허용합니다.")

FieldError 는 오류 발생시 사용자 입력 값을 저장하는 기능을 제공한다.
여기서 rejectedValue 가 바로 오류 발생시 사용자 입력 값을 저장하는 필드다.
bindingFailure 는 타입 오류 같은 바인딩이 실패했는지 여부를 적어주면 된다.
여기서는 바인딩이 실패한 것은 아니기 때문에 false를 사용한다.

✔️ 타임리프의 사용자 입력 값 유지

➡️ th:field="*{price}"

타임리프의 th:field 는 매우 똑똑하게 동작함!
정상 상황에는 모델 객체의 값을 사용하지만, 오류가 발생하면 FieldError 에서 보관한 값을 사용해서 값을 출력한다.

✔️ 스프링의 바인딩 오류 처리

타입 오류로 바인딩에 실패하면 스프링은 FieldError 를 생성하면서 사용자가 입력한 값을 넣어둔다.
그리고 해당 오류를 BindingResult 에 담아서 컨트롤러를 호출한다.
➡️ 따라서 타입 오류 같은 바인싱 실패시에도 사용자의 오류 메시지를 정상 출력할 수 있다.

✔️ 실행 결과

⬆️ 오류 메시지가 떠도 사용자가 입력한 값이 그대로 남아있는 것을 확인

내용이 길어지니 2탄으로 돌아오겠슴다!

sorzzzzy

Backend Developer

이전 포스트

[Spring Boot][5] 3. 메시지, 국제화

다음 포스트

[Spring Boot][5] 4-1. 검증1 - Validation

Spring Boot - RoadMap 1

🏷 검증 요구사항

🏷 프로젝트 설정 V1

🏷 검증 직접 처리 - 소개

✔️ 상품 저장 성공

✔️ 상품 저장 검증 실패

🏷 검증 직접 처리 - 개발

✔️ `ValidationItemV1Controller` - `addItem()` 수정

✔️ `addForm.html`

✔️ 실행 결과

✔️ 정리와 남은 문제점

🏷 프로젝트 준비 V2

✔️ `ValidationItemControllerV2` 컨트롤러 생성

🏷 BindingResult1

✔️ `ValidationItemControllerV2` - `addItemV1`

✔️ `validation/v2/addForm.html` 수정

🏷 BindingResult2

✔️ BindingResult에 검증 오류를 적용하는 3가지 방법

✔️ BindingResult와 Errors

🏷 FieldError, ObjectError

✔️ `ValidationItemControllerV2` - `addItemV2`

✔️ 오류 발생 시 사용자 입력 값 유지

✔️ 타임리프의 사용자 입력 값 유지

✔️ 스프링의 바인딩 오류 처리

✔️ 실행 결과

[Spring Boot][5] 3. 메시지, 국제화

[Spring Boot][5] 4-2. 검증1 - Validation

0개의 댓글

[Spring Boot][5] 4-1. 검증1 - Validation

Spring Boot - RoadMap 1

🏷 검증 요구사항

🏷 프로젝트 설정 V1

🏷 검증 직접 처리 - 소개

✔️ 상품 저장 성공

✔️ 상품 저장 검증 실패

🏷 검증 직접 처리 - 개발

✔️ ValidationItemV1Controller - addItem() 수정

✔️ addForm.html

✔️ 실행 결과

✔️ 정리와 남은 문제점

🏷 프로젝트 준비 V2

✔️ ValidationItemControllerV2 컨트롤러 생성

🏷 BindingResult1

✔️ ValidationItemControllerV2 - addItemV1

✔️ validation/v2/addForm.html 수정

🏷 BindingResult2

✔️ BindingResult에 검증 오류를 적용하는 3가지 방법

✔️ BindingResult와 Errors

🏷 FieldError, ObjectError

✔️ ValidationItemControllerV2 - addItemV2

✔️ 오류 발생 시 사용자 입력 값 유지

✔️ 타임리프의 사용자 입력 값 유지

✔️ 스프링의 바인딩 오류 처리

✔️ 실행 결과

[Spring Boot][5] 3. 메시지, 국제화

[Spring Boot][5] 4-2. 검증1 - Validation

0개의 댓글

✔️ `ValidationItemV1Controller` - `addItem()` 수정

✔️ `addForm.html`

✔️ `ValidationItemControllerV2` 컨트롤러 생성

✔️ `ValidationItemControllerV2` - `addItemV1`

✔️ `validation/v2/addForm.html` 수정

✔️ `ValidationItemControllerV2` - `addItemV2`