본문 바로가기

Spring/Spring.io

Guide - 폼 입력 검증

https://spring.io/guides/gs/validating-form-input

 

Getting Started | Validating Form Input

The application involves validating a user’s name and age, so you first need to create a class that backs the form used to create a person. The following listing (from src/main/java/com/example/validatingforminput/PersonForm.java) shows how to do so: pac

spring.io

 

목표

 

표준 검증 애너테이션을 활용한 입력값 검증

 

  • 응답 : 오류 메세지 표시(사용자 재입력 유도)

 

프로젝트 초기화
  1. https://start.spring.io 접속
  2. 빌드 도구, 언어, 스프링 부트 버전 선택
  3. Dependecies 추가
  4. Generate 클릭 후 zip 파일 다운로드

- 설정 예시

 

PersonForm 객체 생성

 

폼 클래스

//src/main/java/com/example/validatingforminput/PersonForm.java

package com.example.validatingforminput;

import jakarta.validation.constraints.Min;
import jakarta.validation.constraints.NotNull;
import jakarta.validation.constraints.Size;

public class PersonForm {

    @NotNull
    @Size(min=2, max=30)
    private String name;
    @NotNull
    @Min(18)
    private Integer age;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public Integer getAge() {
        return age;
    }

    public void setAge(Integer age) {
        this.age = age;
    }

    @Override
    public String toString() {
        return "Person(Name: " + this.name + ", Age: " + this.age + ")";
    }
}
  • @Notnull : null값을 허용하지 않음
  • @Size(min=2, max=30) : 이름은 2자 이상 30자 이하만 허용
  • @Min(18) : 나이는 18세 미만일 수 없음

 

웹 컨트롤러 생성

 

컨트롤러 클래스

// src/main/java/com/example/validatingforminput/WebController.java

package com.example.validatingforminput;

import jakarta.validation.Valid;
import org.springframework.stereotype.Controller;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.servlet.config.annotation.ViewControllerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Controller
public class WebController implements WebMvcConfigurer {

    @Override
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/results").setViewName("results");
    }

    @GetMapping("/")
    public String showForm(PersonForm personForm) {
        return "form";
    }

    @PostMapping("/")
    public String checkPersonInfo(@Valid PersonForm personForm, BindingResult bindingResult) {

        if (bindingResult.hasErrors()) {
            return "form";
        }

        return "redirect:/results";
    }
}

 

  • /엔드포인트를 두 개의 메서드에서 처리
    • GET 요청은 @GetMapping을 사용해 showForm()에 매핑하여 폼 템플릿 반환
    • POST 요청은 @PostMapping을 사용해 checkPersonInfo()에 매핑하여 입력값 검증
      • @Valid : 매개변수로 받은 PersonForm 객체 검증
      • BindingResult 객체 : 검증 오류가 발생했는지 확인하고 오류 정보 조회
        • 오류가 있다면 원래의 폼 템플릿(/form) 반환
        • 모든 값이 유효하면 최정 결과 템플릿(/results) 반환

 

프론트엔드 템플릿 만들기

 

form.html 템플릿

<!-- src/main/resources/templates/form.html -->

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<body>
<form action="#" th:action="@{/}" th:object="${personForm}" method="post">
    <table>
        <tr>
            <td>Name:</td>
            <td><input type="text" th:field="*{name}" /></td>
            <td th:if="${#fields.hasErrors('name')}" th:errors="*{name}">Name Error</td>
        </tr>
        <tr>
            <td>Age:</td>
            <td><input type="text" th:field="*{age}" /></td>
            <td th:if="${#fields.hasErrors('age')}" th:errors="*{age}">Age Error</td>
        </tr>
        <tr>
            <td><button type="submit">Submit</button></td>
        </tr>
    </table>
</form>
</body>
</html>

 

  • personFrom 객체와 연동되어 있고, / 경로로 POST 요청을 보냄
  • PersonForm 객체의 name과 age는 th:field="*{name}", th:field="*{age}"로 바인딩
  • <td th:if="${#fields.hasErrors('name')}" th:errors="*{name}">Name Error</td>  : name 필드에 오류가 있는 경우 표시

 

results.html 템플릿

<!-- src/main/resources/templates/results.html -->

<html>
<body>
Congratulations! You are old enough to sign up for this site.
</body>
</html>

 

 

애플리케이션 실행

 

애플리케이션 클래스

// src/main/java/com/example/validatingforminput/ValidatingforminputApplication.java

package com.example.validatingforminput;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class ValidatingforminputApplication {

	public static void main(String[] args) {
		SpringApplication.run(ValidatingforminputApplication.class, args);
	}

}
  • @SpringBootApplication 
    • 원래는 @EnableWebMvc를 추가해야하지만 classpath에 spring-webmvc가 있으면 @SpringBootApplication이 자동 추가
    • @SpringBootApplication에 의해 Thymeleaf 설정도 자동 추가 템플릿 파일을 classpath:/templates/ 경로 아래에 두면 .html 확장자가 제거되고 뷰로 처리

 

실행 가능한 JAR 파일 빌드

애플리케이션은 Gradle 또는 Maven을 사용하여 실행할 수 있음

필요한 모든 종속성, 클래스, 리소스를 포함하는 실행 가능한 JAR 파일을 빌드할 수 있음

JAR 파일은 개발 생명 주기, 다양한 환경에서 전달, 버전 관리, 배포를 쉽게 만들어 줌

 

// JAR 파일 빌드 후 실행(Gradle)
./gradlew build // 1. JAR 파일 빌드
ls build/libs/ // 2. JAR 파일 이름 찾기
java -jar build/libs/validatingforminput-0.0.1-SNAPSHOT.jar    // 3. JAR 파일 실행

 

 

서비스 테스트

  • http://localhost:8080/에 접속하여 테스트

초기 화면
입력 범위 오류 화면
널 오류 화면
결과 화면