背景

在前后端分离的大趋势下，项目开发过程中，应尽量减少前端和后台的依赖和耦合，前端和后台尽可能采用 ajax 进行交互；但是全站 ajax，不利于网站 SEO，所以引入模板引擎，尽量减少前端对后端的依赖；SSM 架构下一般采用 Freemarker，Spring Boot 架构下一般推荐采用 Thymeleaf 模板引擎；

SSM 集成 Freemarker

1、引入依赖

<!-- Freemarker 模板引擎 -->
<dependency>
    <groupId>org.freemarker</groupId>
    <artifactId>freemarker</artifactId>
    <version>2.3.29</version>
</dependency>

2、spring mvc 核心配置文件，spring-mvc.xml，添加相关配置；

<!-- freeMarker 视图解析器 -->
<bean id="viewResolverFtl" class="org.springframework.web.servlet.view.freemarker.FreeMarkerViewResolver">
<property name="viewClass" value="org.springframework.web.servlet.view.freemarker.FreeMarkerView"/>
<property name="contentType" value="text/html; charset=utf-8"/>
<property name="cache" value="false"/>
<property name="suffix" value=".ftl"/>
<property name="order" value="0"/>
<property name="requestContextAttribute" value="request"/>
</bean>

<!-- freemarker 核心配置 -->
<bean id="freemarkerConfig" class="org.springframework.web.servlet.view.freemarker.FreeMarkerConfigurer">
<!--解析路径-->
<property name="templateLoaderPath" value="/WEB-INF/view/"></property>
<!-- 设置 FreeMarker 环境属性 -->
<property name="freemarkerSettings">
    <props>
        <!--刷新模板的周期，单位为秒 -->
        <prop key="template_update_delay">5</prop>
        <!--模板的编码格式 -->
        <prop key="default_encoding">UTF-8</prop>
        <!-- 本地化设置 -->
        <prop key="locale">UTF-8</prop>
        <prop key="datetime_format">yyyy-MM-dd HH:mm:ss</prop>
        <prop key="time_format">HH:mm:ss</prop>
        <prop key="number_format">0.####</prop>
        <prop key="boolean_format">true,false</prop>
        <prop key="whitespace_stripping">true</prop>
        <prop key="tag_syntax">auto_detect</prop>
        <prop key="url_escaping_charset">UTF-8</prop>
    </props>
</property>
</bean>

2、Controller 中调用 调用模板，渲染页面效果；

@RequestMapping(value = "/index", method = RequestMethod.GET)
public String index(Model model){
    model.addAttribute("fm","2020");
    return "index";
}

调用模板引擎，跳转到 /WEB-INF/view/index.ftl，传递数据，渲染页面；

3、定义模板文件 命名为：index.ftl；

<!doctype html>
<html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>首页</title>
    </head>
    <body>
        ${fm}
    </body>
</html>