博主
258
258
258
258
标签
elasticsearch kibana LayUI rabbitmq Vue3 springboot linux jdk centos
专辑

第九节 使用Thymeleaf模版实现页面静态化

亮子 2022-02-16 13:28:42 17509 0 0 0

1、什么是页面静态化

是指把动态生成的HTML页面变为静态内容保存，以后用户的请求到来，直接访问静态页面，不再经过服务的渲染。 而静态的HTML页面可以部署在nginx中，从而大大提高并发能力，减小tomcat、数据库的压力。

2、为啥要静态化

对于电商网站来说，商品页面每时每刻都会有大量的用户流量，每个用户在当前浏览的页面就可能会有几十张图片，而且经常会需要动态加载，所以我们就想用静态化提高页面访问速度。

那用什么工具呢？localstorge不合理，存的东西太小了，redis也不合理，即使是30G的redis都可能被撑到满负荷，在springboot和springcloud项目中，使用thymeleaf是一个非常好的选择，我们把页面转换为静态html保存到服务器的硬盘中。

3、THYMELEAF的重要概念

  • Context：运行上下文

用来保存模型数据，当模板引擎渲染时，可以从Context上下文中获取数据用于渲染。当与SpringBoot结合使用时，我们放入Model的数据就会被处理到Context，作为模板渲染的数据使用

  • TemplateResolver：模板解析器

当与SpringBoot结合时，TemplateResolver已经由其创建完成，并且各种配置也都有默认值，比如模板存放位置，其默认值就是：templates。比如模板文件类型，其默认值就是html

  • TemplateEngine：模板引擎

用来解析模板的引擎，需要使用到上下文、模板解析器。分别从两者中获取模板中需要的数据，模板文件。然后利用内置的语法规则解析，从而输出解析后的文件。来看下模板引擎进行处理的函数

4、SpringBoot使用Thymeleaf生成html文件

1）、添加依赖

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

2）、任务代码

package com.shenmazong.thymeleaf.task;

import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.scheduling.annotation.EnableScheduling;
import org.springframework.scheduling.annotation.Scheduled;
import org.springframework.stereotype.Component;
import org.thymeleaf.TemplateEngine;
import org.thymeleaf.context.Context;

import java.io.File;
import java.io.PrintWriter;
import java.util.HashMap;
import java.util.Map;

/**
 * @author 军哥
 * @version 1.0
 * @description: 定时生成静态页面
 * @date 2022/2/16 20:57
 */

@Component
@EnableScheduling
@Slf4j
public class MakeHtmlTask {

    @Autowired
    private TemplateEngine templateEngine;

    // 每分钟执行一次
    @Scheduled(fixedRate = 1000*60)
    public void makeHtml() {
        // 静态文件存储路径
        String storeDir = "D:\\temp";

        // 获取数据
        Map<String, Object> map = new HashMap<>();
        map.put("name", "alex");
        map.put("age", 20);
        map.put("email", "3350996729@qq.com");

        // 上下文
        Context context = new Context();
        context.setVariables(map);
        // 输出流
        File dest = new File(storeDir, "test.html");
        if (dest.exists()) {
            dest.delete();
        }
        try (PrintWriter writer = new PrintWriter(dest, "UTF-8")) {
            // 生成html，第一个参数是thymeleaf页面下的原型名称
            // test参数为templates目录下的test.html文件
            templateEngine.process("make", context, writer);
            log.info("执行生成页面成功！！！");
        } catch (Exception e) {
            log.error("[静态页服务]：生成静态页异常", e);
        }
    }
}

3）、静态模板

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>静态页面模板</title>
</head>
<body>
    <div>
        <div th:text="${name}">name</div>
        <div th:text="${age}">name</div>
        <div th:text="${email}">name</div>
    </div>
</body>
</html>

4）、运行效果

  • 静态文件

图片alt

  • 浏览效果

图片alt