[Spring Boot | Thymeleaf] 데이터 여러 개 전송받기 (@RequestParam, dto, @ModelAttribute)
이전 글
2023.02.13 - [Java & Spring/Spring Boot] - [Spring Boot | Thymeleaf] Form 데이터 전송받기
2023.02.10 - [Java & Spring/Spring Boot] - [Spring Boot | Thymeleaf] @PathVariable url 경로의 값을 변수로 받기
2023.02.08 - [Java & Spring/Spring Boot] - [Spring Boot | Thymeleaf] 타임리프 th:utext=""
2023.02.06 - [Java & Spring/Spring Boot] - [Spring Boot | Thymeleaf] 타임리프 사용방법 및 시작하기
지난 글에서 html form 태그를 사용해서 데이터를 전송하고 받는 방법에 대해서 알아보았습니다. 이번 글에서는 데이터 받기의 응용 편으로, 여러 개의 데이터를 받는 방법에 대해 알아보겠습니다.
먼저 실습을 위한 Controller 클래스와 Get, Post 방식을 처리하는 메서드
html + thymeleaf로 뷰템플릿을 사용합니다.
Controller 클래스와 메서드를 먼저 보겠습니다.
[Controller]
GET 방식의 요청에 대한 처리를 하는 메서드
POST 방식의 요청에 대한 처리를 하는 메서드
2개 의 메서드로 구성이 되어 있고,
POST 메서드를 보면 데이터를 여러 개 받을 수 있도록
파라미터 여러 개가 선언되어 있습니다.
전 글에서 @RequestParam 어노테이션을 사용했었는데요.
html에서 form 태그 하위의 input 태그의 name과 일치하는
@RequestParam에 해당하는 파라미터로 값이 전달됩니다.
Post 메서드를 보면 @RequestParam의 값,
파라미터 id, name, email, age, gender 를 설정한 것을 볼 수 있는데요.
html에서 name에 위 이름을 설정하여 데이터를 전송할 수 있습니다.
[Html + Thymeleaf] multi1.html
위 코드는 multi1.html 코드 입니다. 뷰 페이지에 해당합니다.
input name 값을 확인해보면 name값이
위에서 언급한 것들로 구성되어 있습니다.
서버를 실행하고 해당 웹 페이지를 띄운 뒤
[send] 버튼을 눌러 데이터를 전송하면
다음과 같은 화면을 확인할 수 있습니다.
불편한 점 느끼셨나요?
데이터를 전송할 때
데이터가 10~20개 많게는 50개가 된다고 했을 때
개별 @RequestParam을 선언하는 것이 쉽지는 않을 것입니다.
만약 개발 @RequestParam을 선언한다고 하면,
메서드의 길이가 너무 길어질 수 있습니다.
객체지향 프로그래밍 언어에서 클래스를 사용해
데이터를 묶어서 관리하는 방법을 알고 있습니다.
이를 활용해 코드를 간결하고 재사용성을 높일 수 있습니다.
DTO, VO 라는 개념을 사용하면,
코드를 보다 간결하게 표현할 수 있습니다.
보통 DTO, VO 는 데이터의 묶음 혹은 데이터 전송이 잦은 묶음을 처리할 때
캡슐화해서 관리하기 위해 만들어 사용하곤 합니다.
DTO는 Data Transfer Object, VO는 Value Object 입니다.
form에 있는 name들을 전송받을 수 있는 Dto 클래스를 작성합니다.
ExamDto 클래스
package com.isaac.springbootthymeleaf.dto;
public class ExamDto {
private String id;
private String name;
private String email;
private int age;
private String gender;
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getEmail() {
return email;
}
public void setEmail(String email) {
this.email = email;
}
public int getAge() {
return age;
}
public void setAge(int age) {
this.age = age;
}
public String getGender() {
return gender;
}
public void setGender(String gender) {
this.gender = gender;
}
}
작성한 DTO 클래스를 갖고 여러 개의 데이터를 전송하는데 적용해보겠습니다.
Controller 클래스에 get, post 두 개의 메서드를 작성합니다.
달라진 부분은 @RequestParam을 사용하지 않고,
@ModelAttribute로 Dto를 전달 받는 부분입니다.
그리고 Get방식에도 Dto를 파라미터를 선언한 부분입니다.
view에 해당하는 html 페이지를 보면서도 설명을 하겠지만,
html에서 데이터를 표현할 때,
객체를 표현하는 방식과 일반 데이터를 표현하는 표기가 조금 다릅니다.
다음은 multi-dto.html 소스 입니다.
form 태그에 보면 th:object="${formData}" 로 표현된 것이 있습니다.
서버에서 넘어온 오브젝트(=객체)를 표현하고 있는 것이라 할 수 있습니다.
그리고 그 하위에 실제 객체가 갖고 있는 값들을 표현할 때에는
*{} 표기로 사용하고 있습니다. (ex:th:value="*{id}")
${} 이 표기는 데이터를 직접 바로 표기하는 것이지만,
th:value부분에서 *{} 표기를 사용한다는 것은
th:object에 선언된 객체의 필드를 호출하여 사용한다는 것입니다.
이때 참조하는 객체의 값이 존재하지 않으면 오류가 발생합니다.
따라서 Get방식 메서드에서도 @ModelAttribute 객체 파라미터를 선언하고,
View로 넘겨주는 코드를 작성합니다.
Dto를 사용해 form 데이터 전송
이번 글에서는 form 태그의 여러 개의 데이터를 전송하는 방법에 대해 알아보았습니다.
- @ReqeustParam
- @ModelAttribute Dto
좋아요, 구독, 광고 클릭은 큰 힘이 됩니다 :)
'java, spring' 카테고리의 다른 글
| [Thymeleaf] th:block 타임리프 임시 태그 (0) | 2023.02.25 |
|---|---|
| [Thymeleaf] 다양한 th: 표현과 #strings 유틸리티 (0) | 2023.02.25 |
| [Spring Boot | Thymeleaf] Form 데이터 전송받기 (0) | 2023.02.13 |
| [Spring Boot | Thymeleaf] @PathVariable url 경로의 값을 변수로 받기 (0) | 2023.02.10 |
| [Spring Boot | Thymeleaf] 타임리프 th:utext="" (0) | 2023.02.08 |