如何使用 Thymeleaf 实现 RESTful API 的模板渲染

阅读时长 7 分钟读完

前言

在 Web 开发中,我们常常需要将后端数据渲染到前端页面上。传统的做法是采用服务器端渲染(Server-Side Rendering, SSR)。 SSR 通常更加适用于 MVC 框架等后端渲染的场景,但是对于 RESTful API 服务,由于其数据与展示层逻辑分离的特性,前端组件的构建和管理能力较强,因此通常需要采用前端渲染的方式。

前端渲染,即在前端通过 AJAX 请求后端数据,并在浏览器中使用 JavaScript 对数据进行处理,最终以 DOM 结构展示出来。这种方式的优点是能有效减轻服务器的负担,提升页面渲染速度,缺点则是需要前端开发人员具备较强的前端开发技能。

在前端渲染的过程中,我们不仅需要依赖于各种优秀的前端框架,还需要进一步完善前端渲染工具的开发。

Thymeleaf 模板引擎

在前端框架之外,我们依然需要一些工具支撑前端渲染的工作,其中最重要的就是模板引擎。在这里推荐一个较为实用的模板引擎 Thymeleaf。

Thymeleaf 是一个用于 Web 和独立环境的现代服务器端 Java 模板引擎,能够处理 HTML、XML、JavaScript、CSS 甚至纯文本等多种文本格式,还支持标准和 Spring 种类型的 Web 应用,它通过自然模板名亦或按 ServletContext 或 Spring ApplicationContext 配置等多种途径把你的静态模板或动态模板组织成易于维护的结构,并帮助你实现 MVC 架构中的自然链接。Thymeleaf 的第一个更简单、上手更容易的版本发布于 2011 年 6 月,而 Thymeleaf 3 版本则于 2017 年 3 月发布。

Thymeleaf 主要有以下特性:

  1. 强大的 HTML 标签引擎,支持 HTML5。

  2. 完全兼容 Servlet 规范。

  3. 模板中任何部分都可以是服务器 Java 的变量、方法调用或 Spring Bean 等。

  4. 无需特殊关键字语句,模板具有良好可读性。

  5. 可以用于 Spring Web MVC(模型模型控制器)、Spring WebFlux(反应式 Web )和 Thymeleaf 自己的无 Web 框架模式。

利用 Thymeleaf 渲染 RESTful API

以下是一个简单的示例代码,演示如何利用 Thymeleaf 渲染 RESTful API。

1. 在项目中引入 Thymeleaf 依赖

2. 添加 Thymeleaf 配置

-- -------------------- ---- -------
--------------
------ ----- --------------- -

    -----
    ------ ----------------- ------------------ -
        --------------------------- ---------------- - --- ------------------------------
        ----------------------------------------------------
        -----------------------------------------
        ------------------------------------
        -----------------------------------------------
        -------------------------------------
        ------ -----------------
    -

    -----
    ------ -------------------- ---------------- -
        -------------------- -------------- - --- -----------------------
        -------------------------------------------------------
        ------ ---------------
    -

    -----
    ------ --------------------- ----------------------- -
        --------------------- --------------------- - --- ------------------------
        ----------------------------------------------------------
        ----------------------------------------------------
        ------ ----------------------
    -
-

3. 编写 Thymeleaf 模板文件

-- -------------------- ---- -------
--------- -----
------
----- ----------
    ----- ----------------
    ----------- -------------
-------
------
---- -------------- -- ------ ------------- - ----------
    -- ---------------------------
------
-------
-------

4. 定义 Controller 接口

-- -------------------- ---- -------
---------------
-----------------------
------ ----- -------------- -

    ---------------------- - ------------------
    ------ ------------ ------- -
        ---------- ----- - --- --------------
        ---- ----- - --- -----------
        ---- ----- - --- -----------
        ---- ----- - --- -----------
        -----------------
        -----------------
        -----------------
        ------------ ----- - --- ---------------
        ------------------------ -------
        ---------------------------
        ------ ------
    -

    ----- ---- -
        ------- ------ -----

        ------ ----------- ----- -
            --------- - -----
        -

        ------ ------ --------- -
            ------ -----
        -
    -
-

代码解读:

  • 在上述代码中,我们定义了一个 RESTful API 接口 "/api",它的功能是返回一些数据给前端。

  • 我们为这个接口编写了一个 Controller。该控制器会将 List<user> 对象封装到一个 ModelAndView 对象中并返回。

  • 这个 ModelView 会包含模板名称 index 并且模板变量 model 是我们定义的 users。

  • 模板变量 model 在 Thymeleaf 模板中被解析并且渲染到 HTML 中。

5. 运行程序

浏览器打开:

http://localhost:8080/api

可以看到页面上展示了在 Controller 中定义的"张三"、"李四"、"王五"三个 User。

总结

通过本文,我们已经了解了如何使用 Thymeleaf 模板引擎来渲染 RESTful API 的页面展示。Thymeleaf 是一个功能强大、易于上手的 Java 模板引擎,它能够处理多种文本格式,完全兼容 Servlet 规范,是 Web 开发中一个不可或缺的重要工具。

Thymeleaf 的功能还有很多,需要我们在实践中进一步发现和学习。同时在实践之余,建议我们阅读 Thymeleaf 官方文档,获得更加深入的理解和掌握。

最后,希望这篇文章能够对您有所帮助。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/651a3d0395b1f8cacd23aa2a

纠错
反馈