본문 바로가기

잡지식

[잡지식] Spring MVC, Thymeleaf

서론

@Controller vs @RestController

  • @Controller 어노테이션은 해당 컨트롤러가 templates 패키지 내부의 view를 반환함을 나타낸다.
  • @RestController 어노테이션은 해당 컨트롤러가 json을 반환함을 나타낸다. (with Jackson)

왜 갑자기 어노테이션에 대한 설명이 들어갔는가? → @Controller 어노테이션을 사용해야 view를 반환할 수 있기 때문.

@RestController 어노테이션을 걸어놓고 "왜 view 반환이 안 되고 자꾸 문자열을 반환하지??"라고 생각하면 안 된다.

일단 내가 그랬다.

 


View와 템플릿 엔진

  • @Controller 어노테이션으로 templates 패키지에서 뷰를 가져오는 동작은 Spring MVC의 View Resolver가 담당한다.
  • 뷰를 가져오면서 페이지를 구성하는 작업은 Thymeleaf와 같은 템플릿 엔진이 담당한다.

계층 구조

계층 구조

 


소스 코드

DemoController.java

package com.example.demo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;

@Controller
@RequestMapping("/demo")
public class DemoController {
    @GetMapping("/get")
    public String demoTest(@RequestParam(name = "id") int userId, Model model) {
        model.addAttribute("toHtmlId", userId);
        return "index";
    }
}

 

  • @RequestParam은 name을 지정하면 name을 기준으로 찾는다. 위 코드를 기준으로 한다면 http://localhost:8080/demo/get?id=1 처럼 요청을 날리면 된다.
  • @RequestParam은 name을 지정하지 않으면 파라메터 이름을 기준으로 찾는다. 위 코드를 기준으로 한다면 http://localhost:8080/demo/get?userId=1 처럼 요청을 날리면 된다.
  • 메서드 내부에서는 당연하게도 파라메터의 이름을 사용한다.
  • HTML파일로 보내는 경우, model을 사용해서 보내게 된다. addAttribute를 사용하여 보낸 첫번째 인자는 HTML 파일에서 사용할 attribute 이름이고, 두번째 인자는 현재 메서드에서 넣어 줘야하는 값이다.
  • 위 코드를 요약하자면, 요청으로부터 id값을 넣어서 보내면, 파라메터 userId가 그 값을 갖게 된다. 그리고 model을 통해 toHtmlId라는 이름을 갖는 attribute의 값으로 userId를 넣게 된다. 그렇다면 해당 attribute는 HTML에서 사용할 수 있고, 값이 동적으로 변하게 된다.

index.html

<!DOCTYPE html>
<html lang="ko" xmlns:th="https://www.thymeleaf.org">
  <head>
    <meta http-equiv="Content-Type" , content="text/html; charset=UTF-8" />
    <title>DemoTest</title>
  </head>
  <body>
    <p th:text="'my ID is' + ${toHtmlId} + '!'"> I don't have ID </p>
  </body>
</html>

 

  • xmlns:th="https://www.thymeleaf.org"를 넣어줘야 한다.
  • I don't have ID 라는 <p>태그는 index.html을 여는 경우에 확인할 수 있다.
  • Spring boot의 Controller에서 template으로써 index.html을 반환하는 경우에는 th문법을 따른다.
  • th문법에서 사용하는 attribute는 Controller로부터 받는 값이고 ${}로 감싸서 사용할 수 있다.

 

개발자 도구 화면

 

개발자 도구로 열어보면 html은 th문법에 대한 내용을 모른다.