Layout_Tiles

Ready Settings

Dependencies Injection

<!-- https://mvnrepository.com/artifact/jstl/jstl -->
<dependency>
	<groupId>jstl</groupId>
	<artifactId>jstl</artifactId>
	<version>1.2</version>
</dependency>

<!-- https://mvnrepository.com/artifact/org.apache.tomcat.embed/tomcat-embed-core -->
<dependency>
	<groupId>org.apache.tomcat.embed</groupId>
	<artifactId>tomcat-embed-jasper</artifactId>
	<scope>provided</scope>
</dependency>

<!-- tiles-jsp -->
<dependency>
	<groupId>org.apache.tiles</groupId>
	<artifactId>tiles-jsp</artifactId>
	<version>3.0.8</version>
</dependency>

<!-- tiles-el -->
<dependency>
	<groupId>org.apache.tiles</groupId>
	<artifactId>tiles-el</artifactId>
	<version>3.0.8</version>
</dependency>

• pom.xml
• jstl, tomcat-embed-jasper 의존성 주입
• Tiles의 태그 및 설정을 사용하기 위해 tiles 의존성 주입 (tiles-jsp, tiles-el)

Application

#tomcat port
server:
  port: 8900
#jsp
spring:
  #mvc:
    #view:
      #prefix: /WEB-INF/ipgo/
      #suffix: .jsp
  #TilesViewResolver사용하므로 jspresolver설정은 제거
  devtools:
    livereload:
      enabled: true
#mysql
  datasource:
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: url
    username: name
    password: pass
#mybatis
mybatis:
  type-aliases-package: boot.data.*
  mapper-locations:
  - /mapper/**/*.xml

• 기존 MyBatis와 동일한 설정
• Tiles 설정은 TilesViewResolver를 사용하므로, JspResolver의 설정은 제거

Main Package Settings

Tiles Config

@Configuration
public class TilesConfig {
	
	@Bean
	public TilesConfigurer tilesConfigurer() {
		System.out.println("tiles");
		TilesConfigurer tilesConfigurer = new TilesConfigurer();
		tilesConfigurer.setDefinitions(new String[] {"/WEB-INF/Tiles.xml"});
		tilesConfigurer.setCheckRefresh(true);
		//ViewPreparer에서 Autowired가 가능하게 하는 설정
		tilesConfigurer.setPreparerFactoryClass(SimpleSpringPreparerFactory.class);
		return tilesConfigurer;
	}
	
	@Bean
	public TilesViewResolver tilesViewResolver() {
		TilesViewResolver viewResolver = new TilesViewResolver();
		viewResolver.setViewClass(TilesView.class);
		viewResolver.setOrder(1);

		return viewResolver;
	}

	@Bean
	public UrlBasedViewResolver viewResolver() {
		final UrlBasedViewResolver resolver = new UrlBasedViewResolver();
		resolver.setViewClass(TilesView.class);
		resolver.setOrder(1);
		return resolver;
	}
}

• (Main Package)>TilesConfig.java
• tilesConfigurer 객체의 setDefinitions() 메서드의 인자 값으로 Tiles 설정을 정의할 파일의 절대 경로를 문자열 배열 형식으로 지정

Main Class of Main Method

@SpringBootApplication
@ComponentScan("boot.data.*")
@ComponentScan("boot.last.mini")
@MapperScan("boot.data.mapper")
public class SpringBootMybatisTilesApplication {

	public static void main(String[] args) {
		SpringApplication.run(SpringBootMybatisTilesApplication.class, args);
	}
}

• 다른 설정은 MyBatis와 동일
• Tiles 사용을 위해 Tiles Config 설정을 Main Package에서 했으므로, 이 설정을 스캔하기 위해 Main Package도 @ComponentScan에 등록하여야 함

Tiles Definitions

<?xml version="1.0" encoding="UTF-8"?>
<!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>

</tiles-definitions>

• Tiles를 정의하기 위한 xml 파일이며, 적절한 DOCTYPE 설정 필요
• <tiles-definitions>태그를 통해 Tiles 설정 정의

Register Templates

<tiles-definitions>
	<definition name="layout1" template="/WEB-INF/layout/layout1.jsp">
		<put-attribute name="title" value="/WEB-INF/layout/title.jsp"/>
		<put-attribute name="menu" value="/WEB-INF/layout/menu.jsp"/>
		<put-attribute name="main" value="/WEB-INF/layout/main.jsp"/>
		<put-attribute name="info" value="/WEB-INF/layout/info.jsp"/>
	</definition>
</tiles-definitions>

• Boot 4의 MyBatis_Tiles 설정에서는 복수의 Layout Templates를 등록하여 사용 가능
• 각 Layout의 이름은 name, Template의 경로는 template 속성으로 지정
• 각 Template의 요소는 <put-attribute>태그로 삽입

Refer to Templates

<definition name="home.tiles" extends="layout1">
	<put-attribute name="main" value="/WEB-INF/layout/main.jsp"/>
</definition>

<definition name="list.tiles" extends="layout1">
	<put-attribute name="main" value="/WEB-INF/board/list.jsp"/>
</definition>

<definition name="input.tiles" extends="layout1">
	<put-attribute name="main" value="/WEB-INF/board/addform.jsp"/>
</definition>

• 설정을 완료한 Templates는 <definition>태그의 name을 통해 extends 받아 사용 가능
• <put-attribute>태그는 각 View 파일을(value) Templates의 어떤 요소에 출력할지(name) 지정 가능

Wild Card

<definition name="/*/*" extends="layout1">
	<put-attribute name="main" value="/WEB-INF/{1}/{2}.jsp"/>
</definition>

• 설정 완료한 Templates를 extends하는 View 파일의 수가 많아질 경우 <definition>이 과다해질 우려
• 와일드 카드를 통해 이를 해소
• name은 각 구역을 /* (wild card)로 대체 (list.tiles → /*/*)
• value는 파일의 위상을 지정하며 각 구역을 {n}으로 대체 (WEB-INF/view/list.jsp → WEB-INF/{1}/{2}.jsp)

Controller

Root Mapping

@Controller
public class Controller {

	@Autowired
	MapperInter mapper;
	
	@GetMapping("/")
	public String start() {
		return "/layout/main"; //root파일 매핑주소는 무조건 main
	}
}

• Root 파일의 매핑 주소는 무조건 /main
• /(absolute folder)/..(middle path)../main

@Controller
public class Controller {
	
	@GetMapping("/ipgo/list")
	public ModelAndView list() {
		
		ModelAndView model=new ModelAndView();
		//model.setViewName("ipgoList"); //jsp resolver
		model.setViewName("/ipgo/ipgoList"); //tiles resolver경로
		
		return model;
	}
}

• Root 이외의 매핑 주소 설정은 동일
• 하지만 절대 경로 지정 시 Refer to Templates의 설정에 따라 입력 (WEB-INF/{1}/{2}.jsp → “/ipgo/ipgoList”)
• 기타 사항은 JspResolver의 설정과 동일

View

Get Absolute Root Path

<c:set var="root" value="<%=request.getContextPath() %>"/>
<body>
	<a><img src="${root }/image/title.png"></a>
</body>

• Jsp 파일이므로 Java 문법을 사용하기 위해 Scriptlet 사용
• request 객체의 getContextPath() 메서드를 사용하여 Root 경로 추출하며, JSTL의 <c:set>태그를 이용하여 변수화

Link

<c:set var="root" value="<%=request.getContextPath() %>"/>
<body>
	<ul class="menu">
		<li>
			<a href="${root }">Home</a>
		</li>
		<li>
			<a href="${root }/ipgo/ipgoform">상품등록</a>
		</li>
		<li>
			<a href="${root }/board/list">게시판</a>
		</li>
		<li>
			<a href="${root }/member/list">회원목록</a>
		</li>
	</ul>
</body>

• 변수화한 Root 경로를 이용해 링크 주소 작성
• 모든 링크 주소는 가상의 매핑 주소 (Controller에서 지정)

Index_Root Page

<body>
	<div class="layout">
		<div class="title">
			<tiles:insertAttribute name="title"/>
		</div>
		<div class="menu">
			<tiles:insertAttribute name="menu"/>
		</div>
		<div class="info">
			<tiles:insertAttribute name="info"/>
		</div>
		<div class="main">
			<tiles:insertAttribute name="main"/>
		</div>
	</div>
</body>

• Layout Template의 각 출력 요소는 <tiles:insertAttribute>태그를 통해 삽입