SpringBoot中使用thymeleaf渲染html模板

有时候我们会遇到这样的一个需求： 通过前端传入的数据渲染一个现成的打印模板出来，最后返回一个html格式的文本给前端，模板是有一个现成的，但是每次传入进来的数据是不同的，所以需要后端经过渲染出来返回渲染好的html内容给前端，这个时候我们就可以用thymeleaf来实现这个功能。 我们先建造一个模板：

打印模板是一个用于展示数据的HTML页面。在这个模板中，我们定义了样式和HTML标签，并使用了Thymeleaf的语法来动态填充数据。这个模板的目的是为了能够通过数据渲染出完整的打印内容。

#print_main_full_box { width: 100%; } #print_main_full_box > * { margin: 0; padding: 0; } #print_main_full_box > table, td, th { margin: 0; padding: 0; border: 1px solid black; border-collapse: collapse } .yiban { width: 49%; text-align: left; display: inline-block; /*border-left: 1px solid black;*/ } .jiachu { font-weight:bold; } td { font-size: 14px; } .center { text-align: center; } 公司 出货单 地址 客户名称：客户名称 订单号：订单号 送货地址：送货地址 送货日期：送货日期 联系电话：联系电话 送货单号：送货单号 机器名称: 序号 内部序号 图号 单位 数量 单价 总价 备注 序号 内部序号 图号 单位 数量 单价 总价 哦呵呵 总计： 3 3 送货单位签章: 收货单位签章:

Thymeleaf是一个服务器端Java模板引擎，用于处理HTML、XML、JavaScript、CSS等文件。在这个例子中，我们使用Thymeleaf来填充我们的打印模板。通过在HTML标签上加上Thymeleaf的属性，我们可以将数据绑定到HTML标签上。

这个里面是一个含有thymeleaf语法的模板，现在我们要通过传入的参数不同渲染出不一样的数据出来。

例如前端传入这样的数据：

{ "company":"csdner", "title":"出货单", "address":"中国", "cursumerName":"客户", "orderNo":"2432523234234234", "deliveryAddr":"工业园", "actualDeliveryDate":"20230526", "phone":"18888888888", "invoiceNo":"1567894", "machineName":"25661615", "prods":[ { "selfNumber":"5555", "chartNo":"6666", "company":"csdner", "invoiceNumber":"2222", "unitPrice":"55", "totalPrice":"555", "remarks":"哈哈哈哈" } ], "invoiceNumber":"22", "totalPrice":"102"}

后端要渲染出渲染好之后的html文档给前端：

#print_main_full_box { width: 100%; } #print_main_full_box > * { margin: 0; padding: 0; } #print_main_full_box > table, td, th { margin: 0; padding: 0; border: 1px solid black; border-collapse: collapse } .yiban { width: 49%; text-align: left; display: inline-block; /*border-left: 1px solid black;*/ } .jiachu { font-weight:bold; } td { font-size: 14px; } .center { text-align: center; } csdner 出货单 中国 客户名称：客户 订单号：2432523234234234 送货地址：工业园 送货日期：20230526 联系电话：18888888888 送货单号：1567894 机器名称:25661615 序号 内部序号 图号 单位 数量 单价 总价 备注 序号 5555 6666 csdner 2222 55 555 哈哈哈哈 总计： 22 102 送货单位签章: 收货单位签章:

好了，需求说完，开始实战：

第一步，我们是需要一个thymeleaf的模板，让在项目中引入一个工具类：

添加依赖：

org.thymeleaf thymeleaf 3.0.9.RELEASE ognl ognl 3.1.12 第二步，创建一个工具类： public class HTMLTemplateUtils { private final static TemplateEngine templateEngine = new TemplateEngine(); /** * 使用 Thymeleaf 渲染 HTML * @param template HTML模板 * @param params 参数 * @return 渲染后的HTML */ public static String render(String template, Map params){ Context context = new Context(); context.setVariables(params); return templateEngine.process(template, context); }} 第三步：传入参数： String output = HTMLTemplateUtils.render(content, map);

content为模板，map为前端传入的json数据

第四步，返回output，这个时候output就是我们已经渲染好的模板了

当我们填充完数据后，我们需要将渲染好的HTML返回给前端。在Java中，我们可以将HTML页面渲染成字符串，并将其作为响应返回给前端。前端可以通过解析这个字符串来生成真正的HTML页面，或者将其用于打印等操作。

这篇文章介绍了如何使用Thymeleaf模板引擎来生成HTML文本，以满足在前端渲染一个现成的打印模板的需求。文章首先给出了一个打印模板的HTML代码示例，其中包含了一些静态的文本和一些需要通过变量来动态渲染的部分。然后，文章介绍了如何使用Thymeleaf来渲染HTML模板，从而生成需要的HTML文本，其中包括了如何引入Thymeleaf依赖、如何配置Thymeleaf模板引擎、如何在HTML代码中使用Thymeleaf语法来绑定变量值等等。最后，文章通过一个具体的Java代码示例，演示了如何使用Thymeleaf来渲染上述的HTML模板，将变量值绑定到模板中，并生成HTML文本并返回给前端。