스프링 MVC

준비중..

스프링 MVC

스프링을 사용한 웹서비스 만들기

12 스프링 타일즈3

# 스프링 Tiles ### 프로젝트 구조 스프링 타일즈 설정을 마친 최종 프로젝트 구조는 아래와 같음. ![Imgur](https://i.imgur.com/x0yuN7y.png) ### 라이브러리 추가하기 타일즈 라이브러리를 추가 함. 근데 타일즈3는 스프링3.2 이상부터 적용 됨. 따라서 스프링 버전이 3.2 이상이 아니라면 버전업 할 것.(~~이거 때문에 삽질 개속함 ㅅㅂ..~~) **pom.xml** ```xml <!-- Tiles --> <dependency> <groupId>org.apache.tiles</groupId> <artifactId>tiles-core</artifactId> <version>3.0.7</version> </dependency> <dependency> <groupId>org.apache.tiles</groupId> <artifactId>tiles-jsp</artifactId> <version>3.0.7</version> </dependency> ``` ### 뷰 리졸버 추가 타일즈3 방식 뷰 렌더링을 위해 아래와 같이 설정. **servlet-context.xml** ```xml <!-- Resolves views selected for rendering by @Controllers to .jsp resources in the /WEB-INF/views directory --> <beans:bean class="org.springframework.web.servlet.view.InternalResourceViewResolver"> <beans:property name="prefix" value="/WEB-INF/views/" /> <beans:property name="suffix" value=".jsp" /> <beans:property name="order" value="2" /> </beans:bean> <!-- Tiles 뷰 리졸버 --> <beans:bean id="tielsViewResolver" class="org.springframework.web.servlet.view.UrlBasedViewResolver"> <beans:property name="viewClass" value="org.springframework.web.servlet.view.tiles3.TilesView" /> <beans:property name="order" value="1" /> </beans:bean> <!-- Tiles 설정 파일 --> <beans:bean id="tilesConfigurer" class="org.springframework.web.servlet.view.tiles3.TilesConfigurer"> <beans:property name="definitions"> <beans:list> <beans:value>/WEB-INF/tiles/tiles.xml</beans:value> </beans:list> </beans:property> </beans:bean> ``` ### Tiles 설정 타일즈 관련 설정파일을 생성. **/WEB-INF/tiles/tiles.xml** ```xml <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE tiles-definitions PUBLIC "-//Apache Software Foundation//DTD Tiles Configuration 2.0//EN" "http://tiles.apache.org/dtds/tiles-config_2_0.dtd"> <tiles-definitions> <definition name="classic" template="/WEB-INF/tiles/layouts/classic.jsp"> <put-attribute name="header" value="/WEB-INF/tiles/components/header.jsp" /> <put-attribute name="footer" value="/WEB-INF/tiles/components/footer.jsp" /> </definition> <definition name="*/*" extends="classic"> <put-attribute name="content" value="/WEB-INF/views/{1}/{2}.jsp" /> </definition> </tiles-definitions> ``` ### 레이아웃 파일 생성 **/WEB_INF/tiles/layouts/classic.jsp** ```jsp <%@ page pageEncoding="utf-8" session="false"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles" %> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <c:url var="bootstrap" value="/css/bootstrap.min.css" /> <link href="${ bootstrap }" rel="stylesheet"> </head> <body> <tiles:insertAttribute name="header" /> <tiles:insertAttribute name="content" /> <tiles:insertAttribute name="footer" /> </body> <!-- Optional JavaScript --> <!-- jQuery first, then Popper.js, then Bootstrap JS --> <Script src="https://code.jquery.com/jquery-3.4.1.slim.min.js"></Script> <Script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"></script> <Script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></Script> </html> ``` ### 기타 파일 생성 **/WEB-INF/tiles/components/header.jsp** ```jsp <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <%@ taglib uri="http://www.springframework.org/security/tags" prefix="sec"%> <%@ page pageEncoding="utf-8"%> <nav class="navbar navbar-expand-lg navbar-light bg-light"> <c:url var="rootUrl" value="/" /> <a class="navbar-brand" href="${ rootUrl }">Yes24</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav mr-auto"> <c:url var="booksUrl" value="/books" /> <li class="nav-item active"><a class="nav-link" href="${ booksUrl }">도서<span class="sr-only">(current)</span></a></li> </ul> </div> </nav> ``` **/WEB-INF/tiles/components/footer.jsp** ```jsp <div class="well"> FOOTER </div> ``` ### 홈컨트롤러 리턴값 변경 **HomeController.java** ```java @Controller public class HomeController { @RequestMapping(value = "/", method = RequestMethod.GET) public String home(Locale locale, Model model) { Date date = new Date(); DateFormat dateFormat = DateFormat.getDateTimeInstance(DateFormat.LONG, DateFormat.LONG, locale); String formattedDate = dateFormat.format(date); model.addAttribute("serverTime", formattedDate); // 기존 "home.jsp"에서 변경 // */* 형태로 페이지를 요청하였으므로, // tiles.xml 설정에 의해 content로 전송 됨. return "statics/home"; } } ``` ### 뷰 페이지 구조 및 내용 변경 **views/statics/home.jsp** ```jsp <div class="jumbotron"> <h1>Hello world!</h1> <p>The time on the server is ${serverTime}.</p> </div> ``` ### 동작 확인 브라우저에서 루트 페이지를 호출 함. ![Imgur](https://i.imgur.com/NmbNmbc.png) 헤더와 푸터, 그리고 컨텐츠 내용이 잘 불러와 졌음. ㅅㄱ~~