这篇博客是Freemarker核心重点！！！不过以后在实际开发中，较少使用Servlet，而是使用Spring等高级框架；所以以后的重点是Freemarker和这些高级框架的整合！！！
注：实际中是使用JSP还是Freemarker，哪个更好用，见仁见智，按需选用；；不同的人可能有不同的看法，但目前FreeMarker似乎比JSP接受度高点。
目录
2.在web.xml中配置FreemarkerServlet（核心重点）
1.准备css等前端静态资源；创建ftl文件（将原html中文件复制进去）
5.注解：employee.ftl获取数据是依此从：请求对象，会话对象，全局对象获取的；
一：freemarker与Servlet环境的整合
FreeMarker默认对JavaWeb有良好的支持；
1.引入freemarker.jar
2.在web.xml中配置FreemarkerServlet（核心重点）
在Eclipse中使用【ctrl+shift+t】快捷键查找类文件：
即，引入的freemarker.jar中的FreemarkerServlet这个Servlet类是关键！！！
\
在web.xml中配置：要想使freemarker在web项目中起作用，需要对freemarker.jar中的FreemarkerServlet的这个Servlet类进行配置：
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">
<display-name>fm-web</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>freemarkerppppp</servlet-name>
<!-- FreemarkerServlet这个类就是freemarker提供的一个Servlet，来简化web程序的开发 -->
<servlet-class>freemarker.ext.servlet.FreemarkerServlet</servlet-class>
<init-param>
<!-- 设置ftl加载目录 -->
<param-name>TemplatePath</param-name>
<!-- 以后的ftl文件都会放在 /WEB-INF/ftl目录下-->
<param-value>/WEB-INF/ftl</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>freemarkerppppp</servlet-name>
<!-- *.ftl的意思是，浏览器输入的url如果是以.ftl结尾的话，就会被 FreemarkerServlet这个Servlet处理-->
<!-- 即只要客户端浏览器输入的地址是以.ftl结尾的，这个FreemarkerServlet就会自动的到/WEB-INF/ftl目录中去查找对应名字的文件，并且将其进行输出 -->
<url-pattern>*.ftl</url-pattern>
</servlet-mapping>
</web-app>………………………………
web.xml配置分析：
FreemarkrServlet这个类的作用就是：只要客户端浏览器输入的地址是以.ftl结尾的，这个FreemarkerServlet就会自动的到/WEB-INF/ftl目录中去查找对应名字的文件，并且将其进行输出！！！！！
………………………………
3.查看是否整合成功
为了演示是否配置成功，观察效果，在/WEB-INF目录下创建ftl目录，并添加一个test.ftl文件：
启动应用：
………………………………
注解：
可以这样认为，对freemarker.jar中的FreemarkerServlet的这个Servlet类进行配置是基础；；；；当引入freemarker.jar的jar包，并且对其中的FreemarkerServlet进行配置后，这个web应用（的处理业务）的Servlet就可以识别ftl脚本文件了。背后是freemarker在做支撑！！！
………………………………
二：案例：开发员工信息表
1.准备css等前端静态资源；创建ftl文件（将原html中文件复制进去）
可以发现，本来是employee.html，现在变成了employee.ftl了！！！
启动应用，访问emloyee.ftl：
浏览器显示了employee.ftl这个静态html页面的内容，那么这个静态页面的数据如何从死的变成活的？
2.准备数据，编写后台逻辑代码：
ListServlet：（1）接受并处理客户端浏览器请求准备数据；（2）准备数据；（3）请求转发到employee.ftl，将数据以更好的方式显示出来；（注意看注释）
package com.imooc.freemarker.servlet;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
* Servlet implementation class ListServlet
*/
@WebServlet("/list")
public class ListServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public ListServlet() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
List<Employee> empList = new ArrayList<Employee>();
empList.add(new Employee(7733,"刘芳","销售部","销售经理",8500f));
empList.add(new Employee(7733,"李四","研发部","工程师",7000f));
// So，这两个员工放在哪里，才能被脚本读取到呐？
// 在web环境下中使用freemarker，其会自动从当前的请求会话(ServletRequest)，或者是ServletContext中自动进行查找；
// 这儿我们将empList放在了ServletRequest对象中；一会访问的时候，模板引擎(即FreeMarker)就会自动的从当前请求中获取数据了；
request.setAttribute("employee_list",empList);
// 数据添加好了，如何跳转到employee.ftl那个界面上呐？？？
// 利用请求转发，跳转到employee.ftl
request.getRequestDispatcher("/employee.ftl").forward(request, response);
}
}
Servlet数据创建好了，并且已经请求转发到了employee.ftl，那么employee.ftl文件如何获取到这些数据并显示出来呐？？？
3.前端employee.ftl文件，加载数据
employee.ftl：加载数据：（1）获取到Servlet中准备的数据；将数据组织到html中；
初始的employee.ftl：（这个不重要，是参考的）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>员工列表</title>
<link href="css/bootstrap.css" type="text/css" rel="stylesheet"></link>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<style type="text/css">
.pagination {
margin: 0px
}
.pagination > li > a, .pagination > li > span {
margin: 0 5px;
border: 1px solid #dddddd;
}
.glyphicon {
margin-right: 3px;
}
.form-control[readonly] {
cursor: pointer;
background-color: white;
}
#dlgPhoto .modal-body{
text-align: center;
}
.preview{
max-width: 500px;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<h1 style="text-align: center">IMOOC员工信息表</h1>
<div class="panel panel-default">
<div class="clearfix panel-heading ">
<div class="input-group" style="width: 500px;">
</div>
</div>
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>序号</th>
<th>员工编号</th>
<th>姓名</th>
<th>部门</th>
<th>职务</th>
<th>工资</th>
<th> </th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>7782</td>
<td>张晓涛</td>
<td>研发部</td>
<td>研发工程师</td>
<td style="color: red;font-weight: bold">￥7,780.00</td>
</tr>
<tr>
<td>2</td>
<td>7839</td>
<td>张丽</td>
<td>研发部</td>
<td>运维工程师</td>
<td style="color: red;font-weight: bold">￥8,820.00</td>
</tr>
<tr>
<td>3</td>
<td>5243</td>
<td>张倩</td>
<td>市场部</td>
<td>客户经理</td>
<td style="color: red;font-weight: bold">￥6,000.00</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</body>
</html>修改后的employee.ftl：（重点！！！！！！）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>员工列表</title>
<link href="css/bootstrap.css" type="text/css" rel="stylesheet"></link>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<style type="text/css">
.pagination {
margin: 0px
}
.pagination > li > a, .pagination > li > span {
margin: 0 5px;
border: 1px solid #dddddd;
}
.glyphicon {
margin-right: 3px;
}
.form-control[readonly] {
cursor: pointer;
background-color: white;
}
#dlgPhoto .modal-body{
text-align: center;
}
.preview{
max-width: 500px;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<h1 style="text-align: center">IMOOC员工信息表</h1>
<div class="panel panel-default">
<div class="clearfix panel-heading ">
<div class="input-group" style="width: 500px;">
</div>
</div>
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>序号</th>
<th>员工编号</th>
<th>姓名</th>
<th>部门</th>
<th>职务</th>
<th>工资</th>
<th> </th>
</tr>
</thead>
<tbody>
<#list employee_list as emp>
<tr>
<td>${emp_index + 1}</td>
<td>${emp.empno?string("0")}</td>
<td>${emp.ename}</td>
<td>${emp.department}</td>
<td>${emp.job}</td>
<td style="color: red;font-weight: bold">￥${emp.salary?string("0.00")}</td>
</tr>
</#list>
</tbody>
</table>
</div>
</div>
</div>
</body>
</html>
4.效果：
………………………………
5.注解：employee.ftl获取数据是依此从：请求对象，会话对象，全局对象获取的；
注：
● View（视图）部分，需要提取后台的数据，和html组合在一起，这个工作需要模板引擎，JSP是一种模板引擎，FreeMarker也是一种模板引擎！！！
● 自然JSP这种模板引擎是JEE的标准，Tomcat是厂商的实现中已经内置了JSP的实现了，可以直接用；文件是.jsp；
● FreeMarker这种模板引擎并不是JEE的标准，想要使用FreeMarker需要导入jar包，并进行配置；文件是.ftl；
● 虽然JSP和FreeMarker的使用策略和具体语法存在差异，但是二者的整体使用套路是十分类似的；JSP核心是el和jstl表达式，FreeMarker核心是freemarker语法和内建函数；
860
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
