Apache Tiles
웹사이트를 만들 때 귀찮은 부분 중 하나가 include일 것이다.
사실 include를 사용하는 것도 어느정도 귀찮음에서 벗어나긴 하지만.
위 화면을 include로 개발한다면 매번 새로운 페이지마다 Header와 Menu를 추가시켜줘야한다 .. 여간 귀찮다.
나만그런가?
Apache Tile는 쉽게 말해 템플릿을 기본적으로 구성해주는 프레임워크로써 스프링 뿐 아니라 여러 곳에서 사용이 가능하다.
즉, 기본 셋팅으로 Header와 Menu 그리고 Footer등등 내가 원하는 템플릿레이아웃을 구성시켜두고 바디문만 따로 작성하여서,
View단을 꾸며주는 방식이다.
Spring + Apache Tiles
본 글은 스프링 & 타일즈 적용에 대해 설명할 것이다.
위에서 설명한 것처럼 템플릿을 기본적으로 구성 해둔 뒤에 스프링에서 기본적으로 사용하던 View Resolver 기능인
InternalResourceViewResolver를 TilesViewResolver 타입으로 교체 할 것이다.
타일즈 적용 방식
lib 추가
pom.xml
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-core</artifactId>
<version>3.0.1</version>
</dependency>
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-jsp</artifactId>
<version>3.0.1</version>
</dependency>
ViewResolver 설정
servlet-context.xml
저 이름이 아니라면, appServlet에서 보내는 설정파일 부분에 추가시켜주면 된다
<!-- 타일즈 설정파일-->
<bean id="tilesviewResolver" class="org.springframework.web.servlet.view.tiles3.TilesViewResolver" />
<bean id="tilesConfigurer" class="org.springframework.web.servlet.view.tiles3.TilesConfigurer">
<property name="definitions">
<list>
<value>/WEB-INF/tiles/tiles.xml</value>
</list>
</property>
</bean>
Tiles 설정
tiles.xml
<!DOCTYPE tiles-definitions PUBLIC
"-//Apache Software Foundation//DTD Tiles Configuration 3.0//EN"
"http://tiles.apache.org/dtds/tiles-config_3_0.dtd">
<tiles-definitions>
<definition name="tilesbase"
template="/WEB-INF/views/tiles/layout.jsp">
<put-attribute name="title" value="" />
<put-attribute name="header" value="/WEB-INF/views/tiles/header.jsp" />
<put-attribute name="body" value="" />
<put-attribute name="footer" value="/WEB-INF/views/tiles/footer.jsp" />
</definition>
<definition name="*.page" extends="tilesbase">
<put-attribute name="body" value="/WEB-INF/views/{1}.jsp" />
</definition>
<definition name="*/*.page" extends="tilesbase">
<put-attribute name="body" value="/WEB-INF/views/{1}/{2}.jsp" />
</definition>
<definition name="*/*/*.page" extends="tilesbase">
<put-attribute name="body" value="/WEB-INF/views/{1}/{2}/{3}.jsp" />
</definition>
</tiles-definitions>
위 내용을 하나씩 보자면!
<definition name="tilesbase"
template="/WEB-INF/views/tiles/layout.jsp">
<put-attribute name="title" value="" />
<put-attribute name="header" value="/WEB-INF/views/tiles/header.jsp" />
<put-attribute name="body" value="" />
<put-attribute name="footer" value="/WEB-INF/views/tiles/footer.jsp" />
</definition>
부분은 타일즈의 기본 템플릿을 설정한다.
<definition name="*.page" extends="tilesbase">
<put-attribute name="body" value="/WEB-INF/views/{1}.jsp" />
</definition>
<definition name="*/*.page" extends="tilesbase">
<put-attribute name="body" value="/WEB-INF/views/{1}/{2}.jsp" />
</definition>
<definition name="*/*/*.page" extends="tilesbase">
<put-attribute name="body" value="/WEB-INF/views/{1}/{2}/{3}.jsp" />
</definition>
부분은 ViewResolver로 부터 가져온 body부분을 바꿔 줄 부분을 설정한다.
여기서 나오는 *과 {숫자}는 예를들어
<definition name="*.page" extends="tilesbase">
<put-attribute name="body" value="/WEB-INF/views/{1}.jsp" />
</definition>
부분에서 test로 입력값이 들어오면
<definition name="test.page" extends="tilesbase">
<put-attribute name="body" value="/WEB-INF/views/test.jsp" />
</definition>
test/test2로 입력값이 들어오면
<definition name="test/test2.page" extends="tilesbase">
<put-attribute name="body" value="/WEB-INF/views/test/test2.jsp" />
</definition>
와 같다.
레이아웃 설정
layout.jsp
기본 구성 화면페이지를 설정한다.
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>
<tiles:insertAttribute name="title" ignore="true" />
</title>
</head>
<body>
<center>
<table border="1" align="center">
<tr>
<td height="100"><tiles:insertAttribute name="header" />
</td>
</tr>
<tr>
<td width="600" height="100"><tiles:insertAttribute name="body" />
</td>
</tr>
<tr>
<td height="100"><tiles:insertAttribute name="footer" />
</td>
</tr>
</table>
</center>
</body>
</html>
헤더
header.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
머리
푸터
footer.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
다리
바디
home.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
테스트
컨트롤러 수정
@RequestMapping(value = "/home.do", method = RequestMethod.GET)
public String testTiles(Locale locale, Model model) {
return "home.page";
}
위에 설정한 리졸버값과 맞추어서 return문을 수정한다.
