FreeMarker模板引擎实现页面静态化

注：所有参考文档均附在文末

一、使用情景

公司的cms产品，最近正在做功能迁移，而我正好负责将老后台的文章发布功能迁移到新后台。
文章发布使用到的核心技术是页面静态化。发布的时候，会生成对应的静态页面，并将静态文件保存到指定路径下；同时，刷新cdn，实现修改同步。

二、页面静态化说明

技术原理
静态化一般使用在这种场景：将经常访问但不常修改的页面，转换成静态页面。静态页面是网页（html、htm）的代码都在页面中，不需要执行asp,php,jsp,.net等动态语言而生成客户端网页代码的网页，不经过数据库查询。常见的静态页面举例：.html、.htm。

优点
① 提高速度
比如jsp这一类的动态网页，需要进行数据库查询，这时访问量增加，数据库查询的次数也会随之增加，会占用很大的资源，影响到网站的反应速度。如果把首页、内容静态化的话，就会去除了查询数据库的次数，减少一部分环节，加快网站反应速度。
② 搜索引擎的收录
从网站的优化上来说，搜索引擎更喜欢静态网页，也容易进行抓取，SEO排名也会更高。比如百度、阿里巴巴、搜狐都使用静态网页或者伪静态网页来显示，方便搜索引擎的抓取与排名。
③ 安全性
静态网页不容易被黑客所攻破。静态网页没有查询数据库，不会让黑客看到数据库里的内容。
④ 网站稳定性
如果后台程序、数据库等出现错误，影响网站的访问，影响用户的体验度，降低了用户的信任度，而静态网页就不会出现这种情况。
缺点
① 交互性差，功能上有限制。
② 增加网站的开发复杂度，不利于程序维护和管理。
③ 占用硬盘空间大。
④ 不灵活，静态化操作需要开关的，需要我们专门的设计。

静态化常用技术
FreeMarker
Thymeleaf
Velocity
jsp

FreeMarker有着良好的性能和扩展性等综合优势，且网上可供学习的资源丰富，是我本次文章发布的首选模板引擎，后文主要记录使用FreeMarker实现页面静态化Demo项目的过程。

三、FreeMarker实现页面静态化

FreeMarker官方手册
FreeMarker官方手册（中文版）

1、原理

模板+数据→静态HTML

2、目标

通过FreeMarker模板引擎渲染，在指定目录下，生成文章详情页的静态html文件；打开文件，模板和传入的数据均正常显示。
效果如下：红框内为模板内容，蓝框内为模板数据

3、步骤

说明：JDK8、不涉及数据库（直接传值）、SpringBoot
实体类：article

public class Article {private String title;private String author;private String content;private String date;}

3.1、引入模板引擎

<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-freemarker</artifactId></dependency>

3.2、创建模板
创建ftl格式的模板文件，放在templates目录下（渲染时，会自动找到该目录下的模板），freemarker的语法详见官方文档或百度（该语法支持分页、循环等）

<html>
<head><title>PageStatic</title>
</head>
<body>
标题：${article.title}<br/>
作者：${article.author}<br/>
日期：${article.date}<br/>
正文：${article.content}<br/>
</body>
</html>

3.3、核心方法
service

public interface PageService {public void ftlToHtml() throws IOException, Exception;
}

serviceImpl

public class PageServiceImpl implements PageService {private static final String PATH = "/templates/" ;@Overridepublic void ftlToHtml() throws Exception {// 创建配置类Configuration configuration = new Configuration(Configuration.DEFAULT_INCOMPATIBLE_IMPROVEMENTS);// 设置模板路径String classpath = this.getClass().getResource("/").getPath();File file = new File(classpath + PATH);configuration.setDirectoryForTemplateLoading(file);// 加载模板Template template = configuration.getTemplate("freemarkerTP.ftl");// 数据模型Article article = new Article();article.setTitle("这是文章标题");article.setAuthor("liuhui");article.setDate(DateFormat.getDateInstance().format(new Date()));article.setContent("这是正文内容");Map<String, Object> map = new HashMap<>();map.put("article", article);// 静态化页面内容String content = FreeMarkerTemplateUtils.processTemplateIntoString(template, map);System.out.println("content:{}" + content);InputStream inputStream = new ByteArrayInputStream(content.getBytes("UTF-8"));// 输出文件(指定文件输出目录)FileOutputStream fileOutputStream = new FileOutputStream(new File("D:/huaqiyun/newPage.html"));IOUtils.copy(inputStream, fileOutputStream);// 关闭流inputStream.close();fileOutputStream.close();}
}

controller

@Controller
public class FreemarkerController {@Autowiredprivate PageServiceImpl pageService;@RequestMapping("/freemarker")public void ftlToHtml() throws Exception {pageService.ftlToHtml();}
}

注意：不要使用单元测试来调用方法，页面是通过模板引擎来渲染的，所以必须启动项目，模板引擎才能工作。

3.4、最终效果

指定目录下生成该文件
浏览器打开，动态渲染的html数据无误

参考资料
jsp、freemarker、velocity、thymeleaf页面方案分析
thymeleaf和freemarker谁更好用？
页面静态化模板引擎-Freemaker
SpringBoot2 整合FreeMarker模板，完成页面静态化处理