大家好，我是IT修真院深圳分院第18期学员，一枚正直善良的JAVA程序员。
今天给大家分享一下，修真院官网JAVA任务4中，tiles框架。
一、背景介绍
如果我们所有的页面都是靠对应的一个 jsp 页面来完成的话维护起来会非常繁琐，页面之间有很多相似的部分，如果我们想要修改这些部分德胡啊那么我们就需要一个个的去修改对应的 jsp 页面。这个时候 Tiles 就是为了让我们从这种重复的体力活动中解放出来。
Tiles是一种 JSP 布局框架，主要目的是为了将 jsp 页面拆解为多个子页面，然后用来组合成一个最终表示用页面用的，比如 head、footer，这样的话，便于对页面的机能的变更及维护。tiles使得 springmvc 在页面的处理方面多了一种选择。并且更容易实现代码的重用。
二、demo 实战
下面我来演示一下如何在 springmvc 中使用 Tiles 框架。
1. 添加 tiles 的依赖文件
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-extras</artifactId>
<version>3.0.8</version>
</dependency>
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-servlet</artifactId>
<version>3.0.8</version>
</dependency>
<dependency>
<groupId>org.apache.tiles</groupId>
<artifactId>tiles-jsp</artifactId>
<version>3.0.8</version>
</dependency>
2. 在 WEB-INF 文件夹下添加 Tiles 的配置文件 tiles.xml
我们可以看到在这里首先我们定义了一个 base，这个名字可以任取，只要不和 controller 里面跳转的 string 一样就好。因为在 controller 里面跳转网页的时候设定的 string 就对应了我们配置文件中的 name 属性。
在这个基础框架中我们引用了一个布局文件 page.jsp 【这个我后面会给出】，然后插入了预先设定好的 header 和 footer。因为这些部分对于我们的网站的每个网页来说都是一样的。
接下来我们定义了页面 home，它继承了上述的框架，并且插入了自己独一无二的 body 部分。
<?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>
<definition name="base" template="/page.jsp">
<put-attribute name="header" value="/header.jsp" />
<put-attribute name="footer" value="/footer.jsp" />
</definition>
<definition name="home" extends="base">
<put-attribute name="body" value="/home.jsp" />
</definition>
</tiles-definitions>
3. 设定布局文件 page.jsp 与 其他子页面
page.jsp 内容如下：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="t"%>
<%@ page session="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>page</title>
<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body style="text-align: center;margin: auto;">
<div id="header">
<t:insertAttribute name="header"/>
</div>
<div id="content">
<t:insertAttribute name="body"/>
</div>
<div id="footer">
<t:insertAttribute name="footer"/>
</div>
</body>
</html>
接下来，我们需要添加其他的子网页，让 tiles 来拼接它们。
header.jsp：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>header</title>
</head>
<body>
<h1 style="font-weight: bold;color: silver;">Tiles</h1>
</body>
</html>
home.jsp：
<body>
hello tiles,I'm home.
</body>
footer.jsp：
<body>
<div>
<footer>
<p class="pull-right">
<a href="#">Back to top</a>
</p>
<p>
© 2016 Company, Inc. · <a href="#">Privacy</a> · <a href="#">Terms</a>
</p>
</footer>
</div>
</body>
3. 在 springmvc 配置文件中启用 Tiles
<bean id="viewResolver" class="org.springframework.web.servlet.view.tiles3.TilesViewResolver">
<property name="viewClass">
<value>org.springframework.web.servlet.view.tiles3.TilesView</value>
</property>
</bean>
<bean id="tilesConfigurer" class="org.springframework.web.servlet.view.tiles3.TilesConfigurer">
<property name="definitions">
<list>
<value>/WEB-INF/tiles.xml</value>
</list>
</property>
</bean>
最后我们在 controller 里面设置好跳转就可以把项目跑起来了！
需要注意的是 controller 只能跳转到 tiles.xml 中定义的 name，否则 tiles 不知道我们到底需要访问什么页面。
三、我们可能会遇到的问题
1. 网页中文乱码
由于我们把网页拆分成了多个子 jsp 文件，所以每个文件都是单独经过应用服务器编译后再去拼接，这个时候必须要每个 jsp 页面的上方添加如下标签，确定其编码格式。
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
四、其他的思考
1. tiles 套页面是否有学习的必要？
答：有的。虽然现在都流行使用 restful 的接口，前后端分离开发。但是这种套页面的开发方式在短时间内还会有一定的需求。
2. tiles 项目早已停止开发，是否有其他替代方案？
答：Sitemesh3.0
技能树.IT修真院
“我们相信人人都可以成为一个工程师，现在开始，找个师兄，带你入门，掌控自己学习的节奏，学习的路上不再迷茫”。
这里是技能树.IT修真院，成千上万的师兄在这里找到了自己的学习路线，学习透明化，成长可见化，师兄1对1免费指导。快来与我一起学习吧~
网友评论