网站页面静态化（二）thymeleaf生成

夜郎king

已于 2022-09-01 21:52:37 修改

阅读量1.6w

点赞数 1

分类专栏： java 工作拾遗中间件文章标签： spring boot 静态模板引擎 thymeleaf

于 2022-02-03 09:56:43 首次发布

本文链接：https://blog.csdn.net/yelangkingwuzuhu/article/details/122774210

版权

java 同时被 3 个专栏收录

67 篇文章 9 订阅

订阅专栏

工作拾遗

57 篇文章 4 订阅

订阅专栏

中间件

43 篇文章 4 订阅

订阅专栏

今年是农历大年初三，在这里首先给各位朋友拜个年，祝大家新年快乐，虎年大吉大利，事业蒸蒸日上。过年无事，把页面静态化技术整理整理。本文将以thymeleaf为例子，说明在springboot当中，如何基于thymeleaf模板引擎进行页面静态化，关于静态化的一些说明见网站页面静态化（一）初识。

thymeleaf模板引擎是springboot官方的标准配置，是一款高性能的前端模板引擎。这里需要说明的是，与时下流行的vue、react等前端框架不一样，thymeleaf的技术栈是以传统的modelandview为主，但是可以基于thymeleaf进行一些网页的静态化操作。下面进入正文，详细说明如何进行集成。

第一步、创建一个maven的springboot工程。

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>com.yelang</groupId>
  <artifactId>boot-thymeleaf-static</artifactId>
  <version>0.0.1-SNAPSHOT</version>
  <name>boot-thymeleaf-static</name>
  <description>基于springboot和thymeleaf的页面静态化演示</description>
  
  <properties>
		<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
		<maven-jar-plugin.version>3.1.1</maven-jar-plugin.version>
	</properties>

	<parent>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-parent</artifactId>
		<version>2.2.13.RELEASE</version>
	</parent>

	<dependencies>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-web</artifactId>
		</dependency>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-test</artifactId>
			<scope>test</scope>
		</dependency>

		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-thymeleaf</artifactId>
		</dependency>
		
		<!-- https://mvnrepository.com/artifact/org.projectlombok/lombok -->
		<dependency>
		    <groupId>org.projectlombok</groupId>
		    <artifactId>lombok</artifactId>
		    <scope>provided</scope>
		</dependency>
		
		<!-- https://mvnrepository.com/artifact/junit/junit -->
		<dependency>
		    <groupId>junit</groupId>
		    <artifactId>junit</artifactId>
		    <scope>test</scope>
		</dependency>
		
	</dependencies>

	<build>
		<finalName>${project.artifactId}</finalName>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <configuration>
                    <fork>true</fork> <!-- 如果没有该配置，devtools不会生效 -->
                </configuration>
            </plugin>
        </plugins>
	</build>
</project>

以上引用的关键是引入spring-boot-starter-thymeleaf。

第二步、在templates目录下创建待生成的网页模板。如下图：

模板如下：

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>静态化模板</title>
</head>
<body>
	<h1 th:text="${person.id}"></h1>
	<h1 th:text="${person.username}"></h1>
	<h1 th:text="${person.age}"></h1>
</body>
</html>

这里为了简单起见，只保留最简单的代码，正常的网页中还有js还有css，这些资源可以部署在静态资源或者cdn中以提高访问速度。

第三步、使用thmeleaf进行网页流写入

@Service
public class PersonService {
	
    private final static String DESC_PATH = "d:/person/";
    @Autowired
    TemplateEngine templateEngine;

    public void createHtml(int id){
        //创建上下文
        Context context = new Context();
        Person person = loadPerson(id);
        //上下文放入数据
        context.setVariable("person",person);
        //路径的判断，没有自动创建
        File file0 = new File(DESC_PATH);
        if (!file0.exists()){
            file0.mkdirs();
        }
        //定义本地保存的静态文件名
        File file = new File(DESC_PATH+id+".html");
        if(file.exists()){
            file.delete();
        }
        try {
            //定义一个打印流
            PrintWriter pw = new PrintWriter(file);
            templateEngine.process("person",context,pw);
        } catch (FileNotFoundException e) {
            e.printStackTrace();
        }
    }
	//模拟封装数据的方法
    public Person loadPerson(int id){
        Person p = new Person();
        p.setUsername("yelangking");
        p.setAge(18);
        p.setId(id);
        return p;
    }
}

这里的代码比较简单，完成的功能就是创建上下文环境，准备数据，模板填充，目标文件写入。

第四步、测试静态网页生成

@SpringBootTest
class ThymeleafFirstApplicationTests {

	@Autowired
	PersonService personService;

	@Test
	void contextLoads() {
		personService.createHtml(88088);
	}
}

这里通过junit模拟的方式进行页面生成，实际开发当中，应该是根据数据库或者缓存中的待转化的页面列表来动态生成，文件存储的目录应该替换成文件存储系统的目录。

第五步、系统输出的静态文件如下：

总结：通过上述例子即说明了如何基于springboot和thymeleaf的全站页面静态化方案的大概解决方案雏形。例子中说明了具体的处理流程以及关键技术，至于存储和网页模板需要根据实际项目进行调整开发。

夜郎king

关注

1
点赞
踩
8

收藏

觉得还不错? 一键收藏
打赏
6
评论
网站页面静态化（二）thymeleaf生成

本文说明了如何基于springboot和thymeleaf的全站页面静态化方案的大概解决方案雏形。例子中说明了具体的处理流程以及关键技术，至于存储和网页模板需要根据实际项目进行调整开发。
复制链接

扫一扫