spring boot如何配置thymeleaf

原创

mob64ca12efd81c 2024-09-07 04:47:15 ©著作权

文章标签 spring java xml 文章分类 spring boot 后端开发

©著作权归作者所有：来自51CTO博客作者mob64ca12efd81c的原创作品，请联系作者获取转载授权，否则将追究法律责任

Spring Boot 如何配置 Thymeleaf

在现代的Web应用程序中，前后端分离的架构日益普遍，但仍有很多项目需要一个简便的方式来搭建前端与后端的交互。Spring Boot与Thymeleaf的组合使得开发者可以快速实现服务器端渲染（SSR）的Web应用。在这篇文章中，我们将深入探讨如何在Spring Boot项目中配置Thymeleaf，并结合代码示例进行说明。

项目背景

假设我们正在开发一个简单的图书管理系统，该系统允许用户查看书籍信息和添加新书。我们将使用Spring Boot作为后端框架，同时使用Thymeleaf作为模板引擎。Thymeleaf能够简化动态内容的呈现，使得前端页面的开发更加高效。

项目结构

在开始配置之前，我们先来看一下我们的项目结构：

book-management
│
├── src
│   ├── main
│   │   ├── java
│   │   │   └── com
│   │   │       └── example
│   │   │           └── bookmanagement
│   │   │               ├── BookManagementApplication.java
│   │   │               └── controller
│   │   │                   └── BookController.java
│   │   └── resources
│   │       ├── templates
│   │       │   └── books.html
│   │       └── application.properties
└── pom.xml

pom.xml 配置

首先，我们需要在 Maven 的 pom.xml 文件中引入Thymeleaf的相关依赖。

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

Controller 实现

接下来，我们将创建一个控制器来处理书籍相关的请求。在 BookController 中，我们添加一个方法来展示书籍列表。

package com.example.bookmanagement.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

import java.util.ArrayList;
import java.util.List;

@Controller
public class BookController {

    @GetMapping("/books")
    public String listBooks(Model model) {
        List<String> books = new ArrayList<>();
        books.add("Spring in Action");
        books.add("Design Patterns");
        books.add("Effective Java");
        
        model.addAttribute("books", books);
        return "books";
    }
}

在这个代码片段中，我们创建了一个 /books 路径，返回一个包含书籍内容的视图。

Thymeleaf 模板

然后，我们需要在 src/main/resources/templates 目录下创建一个名为 books.html 的文件，其中使用Thymeleaf语法来渲染书籍列表。

<!DOCTYPE html>
<html xmlns:th="
<head>
    <title>Book List</title>
</head>
<body>
    Books
    <ul>
        <li th:each="book : ${books}" th:text="${book}"></li>
    </ul>
</body>
</html>

在这个HTML模板中，我们使用了Thymeleaf的标准语法来循环遍历书籍并显示。

应用配置

最后，我们在 application.properties 和 src/main/java/com/example/bookmanagement/BookManagementApplication.java 中进行基本的配置。

# application.properties
server.port=8080

package com.example.bookmanagement;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class BookManagementApplication {
    public static void main(String[] args) {
        SpringApplication.run(BookManagementApplication.class, args);
    }
}

交互流程

要帮助我们理解控制器和视图的交互过程，下面是一个简单的序列图，用于展示用户请求与响应的流程：

sequenceDiagram
    Participant User
    Participant Controller
    Participant View
    
    User->>Controller: 请求 /books
    Controller->>Model: 获取书籍列表
    Model-->>Controller: 返回书籍数据
    Controller->>View: 返回视图 books.html
    View-->>User: 渲染书籍列表

此外，以下是用户访问过程中旅程图的示意：

journey
    title 用户访问书籍列表的旅程
    section 用户访问
      用户请求书籍列表: 5: 用户
      控制器处理请求: 4: 控制器
    section 数据处理
      从数据库获取书籍数据: 3: 控制器
    section 页面渲染
      返回书籍列表: 5: 视图