한재원

한재원

🛠️ 저는 커서 백엔드 개발자가 될래요!

[데브코스] Spring MVC 1

Updated: Categories:

W5D2 - DispatcherServlet / JSP / Thymeleaf 에 대해 알아보자.

Spring MVC

Dispatch Servlet

  • Front Contoller로써 Servlet을 생성해 요청을 받아 하위 컨트롤러에 분배하는 역할

image

image

image

image

  • HTTP 요청을 핸들러 어댑터를 통해 컨트롤러에 연결시켜준다

View Resolver

  • 요청 URL에 알맞는 view로 반환시켜주는 것 (템플릿 엔진 선택 or json response 등등..)
    • InternalResourceViewResolver
    • ThymeleafViewResolver

image


최종 아키텍처

image


JSP

의존성 설정

  • 서블릿과 jstl을 추가해야함 (서블릿은 전에 추가했으니)
<!-- jstl -->
<dependency>
	<groupId>javax.servlet</groupId>
	<artifactId>jstl</artifactId>
	<version>1.2</version>
</dependency>

App Context 설정

  • WebMvc를 사용할 수 있도록 App Context를 설정해줘야 한다.
  • @EnableWebMvc 어노테이션을 달아주고 WebMvcConfigurer를 상속 -> ViewResolver를 설정해준다.
...
@EnableWebMvc
static class config implements WebMvcConfigurer {
    // ViewResolvers -> 템플릿 엔진을 jsp로 지정
    @Override
    public void configureViewResolvers(ViewResolverRegistry registry) {
        registry.jsp();
    }
    ...
}


  • 그리고 WebApplicationInitializer에서 DispatcherServlet을 만들고 등록시켜줘야함
  • App Context 객체 생성시 그냥 App이 아니라 WebApp으로 생성해준다
  • App Context 객체 생성 -> 그걸로 DispatcherServlet 생성 -> 그걸로 서블릿 객체 생성
public class 클래스명 implements WebApplicationInitializer {
  @Override
  public void onStartup(ServletContext servletContext){
      var applicationContext = new AnnotationConfigWebApplicationContext();
      applicationContext.register(AppConfig.class);
      var dispatcherServlet = new DispatcherServlet(applicationContext);

      var servletRegistration = servletContext.addServlet(서블릿명, dispatcherServlet);
      servletRegistration.addMapping("/");
      servletRegistration.setLoadOnStartup(1);
  }
}

Controller 작성

  • 매핑할 URL과 HTTP 메소드를 적어준다
  • 데이터에 view(jsp) 이름을 붙여서 반환해줌 -> 해당 jsp 파일에 데이터 바인딩
  • model로 사용할 데이터는 Map으로 전달한다
@Controller
public class 컨트롤러 {
    @RequestMapping(value = URL설정, method = RequestMethod.GET)
    public ModelAndView 메소드명() {
        return new ModelAndView(view이름, 데이터);
    }
}

JSP 작성

  • 디렉토리 webapp 하위 WEB-INF에서 작성해야 빌드시 적용됨
  • html처럼 사용
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
...

jstl

  • JSP내에서 데이터 바인딩 or 자바코드 작성을 가능하게 해주는 문법
  • 모델의 key값을 ${ key } 이렇게 넣어서 데이터 바인딩 가능
  • <% %> 태그 사이에서 자바 문법 사용 가능
  • 아니면 아래처럼 c태그를 사용할수도 있음
<c:forEach var="i" begin="i" end="10" step="1">
  ${i}<br>
</c:forEach>
  • 다양한 문법이 있겠지만… jsp 개발을 할게 아니므로 PASS

resources

  • webapp폴더 하위에 resources 폴더를 생성하고, 이 폴더에서 리소스를 관리
  • 그리고 App Context에 ResourceHandler를 추가해준다.
  • resources 경로를 설정해준다.
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
    registry.addResourceHandler("/resources/**")
            .addResourceLocations("/resources/");
}


Thymeleaf

의존성 설정

  • 추가해주자 ^^
<!-- jstl -->
<dependency>
	<groupId>javax.servlet</groupId>
	<artifactId>jstl</artifactId>
	<version>1.2</version>
</dependency>
  • 추가하고 나면 아래 표시한곳에 뭐가 뜨는데 그것도 다 추가해주기

image

App Context 설정

  • ViewResolver에 Thymeleaf를 등록해준다
  • AppContext Config 내부에서 AppContext가 필요해서 ApplicationContextAware 어노테이션으로 의존성주입~
static class AppConfig implements WebMvcConfigurer, ApplicationContextAware {
  ApplicationContext applicationContext;
  @Override
  public void configureViewResolvers(ViewResolverRegistry registry) {
      var springResourceTemplateResolver = new SpringResourceTemplateResolver();
      springResourceTemplateResolver.setApplicationContext(applicationContext);
      // 템플릿 기본 경로,확장자 설정
      springResourceTemplateResolver.setPrefix("/WEB-INF/");
      springResourceTemplateResolver.setSuffix(".html");
      var springTemplateEngine = new SpringTemplateEngine();
      springTemplateEngine.setTemplateResolver(springResourceTemplateResolver);
      // 템플릿 기본 디렉토리 설정(jsp와 혼용시 필요)
      var thymeleafViewResolver = new ThymeleafViewResolver();
      thymeleafViewResolver.setTemplateEngine(springTemplateEngine);
      thymeleafViewResolver.setOrder(1);
      thymeleafViewResolver.setViewNames(new String[]{"views/*"});
      registry.viewResolver(thymeleafViewResolver);
  }
  ...

Thymeleaf 작성

  • 확장자는 html로 작성함
  • 아래 태그를 생성한 후 작성해야한다.
<html xmlns:th="http://www.thymeleaf.org" lang="en">
...
  • 자세한 문법은 생략한다.