Spring Boot中将特定字段映射到HTML页面:DTO与视图渲染实践

Spring Boot中将特定字段映射到HTML页面:DTO与视图渲染实践

本文将深入探讨如何在Spring Boot应用中,从后端实体中选择性地提取特定字段,并将其高效且安全地渲染到HTML页面。我们将重点介绍数据传输对象(DTO)作为最佳实践,结合Spring MVC控制器和模板引擎(如Thymeleaf),实现数据展示层与业务逻辑的解耦,并讨论其他序列化控制策略。

1. 问题背景与目标

在spring boot开发中,我们经常会遇到这样的场景:后端服务从数据库获取一个包含多个字段的完整实体对象(例如adventureholidays),但前端页面(html)或特定的api接口只需要其中的部分字段(例如title和description)。直接将完整实体暴露给前端可能导致不必要的数据传输、安全隐患,并增加前端解析的复杂性。我们的目标是实现一个spring boot控制器,当被调用时,能够返回一个只包含所需特定字段的html页面。

原始的AdventureHolidays实体定义如下:

@Document("adventureholidays")public class AdventureHolidays {    @Id    private String id;    private String title;    private String description;    private String typeOfAdventureHolidays;    // Getter方法    public String getId() { return id; }    public String getTitle() { return title; }    public String getDescription() { return description; }    public String getTypeOfAdventureHolidays() { return typeOfAdventureHolidays; }    // Setter方法(如果需要)    public void setId(String id) { this.id = id; }    public void setTitle(String title) { this.title = title; }    public void setDescription(String description) { this.description = description; }    public void setTypeOfAdventureHolidays(String typeOfAdventureHolidays) { this.typeOfAdventureHolidays = typeOfAdventureHolidays; }}

一个典型的控制器可能返回完整的JSON列表:

@RestControllerpublic class AdventureApiController {    @Autowired    private AdventureHolidaysService adventureHolidaysService;    @GetMapping("/getRandomSummerCamps")    public List getRandomSummerCamps() {        return adventureHolidaysService.getRandomSummerCamps();    }}

当访问/getRandomSummerCamps时,会得到类似以下包含所有字段的JSON响应:

[{"id":"123","title":"Raquette Lake Camp","description":"Founded in 1916...","typeOfAdventureHolidays":"summerCamps"}]

而我们的目标是,在HTML页面中只显示title和description。

立即学习“前端免费学习笔记(深入)”;

2. 核心策略:数据传输对象 (DTO)

数据传输对象(DTO)是解决此类问题的最佳实践。DTO是一个简单的Java对象,其主要目的是在应用程序的不同层之间传输数据。它只包含前端或特定服务所需的数据字段,从而将领域模型与表示层解耦。

DTO的优势:

解耦: 将领域实体与视图层分离,防止不必要的字段暴露。安全性: 避免敏感数据(如数据库ID、内部状态)泄露到客户端。性能: 减少传输的数据量,提高网络效率。灵活性: 可以为不同的视图或API设计不同的DTO,满足多样化的需求。

2.1 创建DTO

针对我们的需求,创建一个只包含title和description的AdventureSummaryDTO:

// src/main/java/com/example/demo/dto/AdventureSummaryDTO.javapackage com.example.demo.dto;public class AdventureSummaryDTO {    private String title;    private String description;    // 构造函数    public AdventureSummaryDTO(String title, String description) {        this.title = title;        this.description = description;    }    // Getter 方法    public String getTitle() {        return title;    }    public String getDescription() {        return description;    }    // Setter 方法 (如果需要,但对于DTO通常不需要)    public void setTitle(String title) {        this.title = title;    }    public void setDescription(String description) {        this.description = description;    }}

2.2 改造Spring Boot控制器以返回HTML

为了返回HTML页面,我们需要将控制器类型从@RestController改为@Controller,并使用Spring MVC的Model对象将数据传递给视图模板。

// src/main/java/com/example/demo/controller/AdventureWebController.javapackage com.example.demo.controller;import com.example.demo.dto.AdventureSummaryDTO;import com.example.demo.model.AdventureHolidays;import com.example.demo.service.AdventureHolidaysService;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.stereotype.Controller;import org.springframework.ui.Model;import org.springframework.web.bind.annotation.GetMapping;import java.util.List;import java.util.stream.Collectors;@Controller // 注意这里是 @Controller,用于返回视图public class AdventureWebController {    @Autowired    private AdventureHolidaysService adventureHolidaysService;    @GetMapping("/summerCampsHtml") // 定义一个新的URL路径用于HTML页面    public String getSummerCampsHtml(Model model) {        // 1. 从服务层获取完整的实体列表        List summerCamps = adventureHolidaysService.getRandomSummerCamps();        // 2. 将实体列表转换为DTO列表        List summaryCamps = summerCamps.stream()                .map(camp -> new AdventureSummaryDTO(camp.getTitle(), camp.getDescription()))                .collect(Collectors.toList());        // 3. 将DTO列表添加到Model中,以便在HTML模板中使用        model.addAttribute("camps", summaryCamps);        // 4. 返回视图名称。Spring Boot将根据配置查找对应的HTML模板        return "summerCampsView"; // 假设存在一个名为 summerCampsView.html 的模板    }}

说明:

@Controller 注解表明这是一个处理Web请求并返回视图的控制器。Model 对象用于在控制器和视图之间传递数据。stream().map().collect() 是Java 8的流式API,用于高效地将AdventureHolidays列表转换为AdventureSummaryDTO列表。return “summerCampsView”; 告诉Spring MVC去渲染名为summerCampsView的视图。如果使用Thymeleaf,它会默认在src/main/resources/templates/目录下查找summerCampsView.html文件。

2.3 创建HTML视图模板 (以Thymeleaf为例)

在src/main/resources/templates/目录下创建summerCampsView.html文件:

        夏令营列表            body { font-family: Arial, sans-serif; margin: 20px; }        .camp-item { border: 1px solid #ddd; padding: 15px; margin-bottom: 10px; border-radius: 5px; }        h2 { color: #333; margin-top: 0; }        p { color: #666; }        

随机夏令营

没有找到任何夏令营信息。

营地标题占位符

营地描述占位符

说明:

xmlns:th=”http://www.thymeleaf.org” 声明了Thymeleaf命名空间。th:each=”camp : ${camps}” 迭代控制器中通过model.addAttribute(“camps”, summaryCamps);传递过来的camps列表。th:text=”${camp.title}” 和 th:text=”${camp.description}” 将每个AdventureSummaryDTO对象的title和description属性值渲染到HTML元素中。

3. 其他序列化控制策略

虽然DTO是处理特定字段展示的最佳实践,但在某些情况下,Spring Boot也提供了其他控制JSON序列化的方法。

3.1 @JsonIgnore 注解

@JsonIgnore 是Jackson库提供的注解,用于在对象序列化为JSON时忽略某个字段。

示例:如果你希望AdventureHolidays实体在任何JSON输出中都忽略typeOfAdventureHolidays字段,可以在该字段上添加@JsonIgnore:

import com.fasterxml.jackson.annotation.JsonIgnore;import org.springframework.data.annotation.Id;import org.springframework.data.mongodb.core.mapping.Document;@Document("adventureholidays")public class AdventureHolidays {    @Id    private String id;    private String title;    private String description;    @JsonIgnore // 该字段在JSON序列化时将被忽略    private String typeOfAdventureHolidays;    // Getter/Setter...}

注意事项:

全局性忽略: 一旦添加,该字段在所有返回AdventureHolidays对象的JSON响应中都会被忽略。仅影响JSON: 它只控制JSON序列化,不会直接影响HTML模板渲染。如果控制器返回的是AdventureHolidays对象给HTML模板,模板仍然可以访问被@JsonIgnore标记的字段(因为它仍在Java对象中)。不适用于动态需求: 如果某些API需要该字段,而另一些不需要,@JsonIgnore就不适用了。

3.2 @JsonView 注解

@JsonView 允许你定义不同的“视图”,并根据请求选择性地序列化实体字段。这适用于同一个实体需要在不同场景下暴露不同字段集合的情况。

示例 (简要介绍):

定义视图接口:

public class Views {    public static class Public {}    public static class Internal extends Public {}}

在实体字段上标记视图:

public class AdventureHolidays {    @JsonView(Views.Public.class)    private String title;    @JsonView(Views.Public.class)    private String description;    @JsonView(Views.Internal.class) // 只有Internal视图才能看到    private String typeOfAdventureHolidays;    // ...}

在控制器方法上指定视图:

@RestControllerpublic class AdventureApiController {    @GetMapping("/publicCamps")    @JsonView(Views.Public.class)    public List getPublicCamps() {        return adventureHolidaysService.getRandomSummerCamps();    }    @GetMapping("/internalCamps")    @JsonView(Views.Internal.class)    public List getInternalCamps() {        return adventureHolidaysService.getRandomSummerCamps();    }}

注意事项:

@JsonView 主要用于JSON序列化,对于HTML模板渲染同样不直接适用。它提供了比@JsonIgnore更细粒度的控制,但配置相对复杂。

4. 总结

在Spring Boot中,当需要将后端实体中的特定字段渲染到HTML页面时,使用DTO(数据传输对象)是推荐的最佳实践。它通过将数据模型与视图表示分离,提供了清晰的结构、增强了安全性,并提高了代码的可维护性。

关键步骤:

创建DTO: 定义一个只包含所需字段的DTO。改造控制器:使用@Controller注解。从服务层获取完整实体。将实体映射到DTO。使用Model对象将DTO列表添加到视图。返回视图名称。创建HTML模板: 使用Thymeleaf等模板引擎迭代DTO列表并显示字段。

对于JSON序列化场景,@JsonIgnore适用于永久性地排除字段,而@JsonView则提供了更灵活的视图管理功能,但它们都与直接渲染HTML页面的需求有所不同。理解这些工具的用途和局限性,有助于开发者根据具体业务需求选择最合适的解决方案。

以上就是Spring Boot中将特定字段映射到HTML页面:DTO与视图渲染实践的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1579239.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月22日 20:27:32
下一篇 2025年12月22日 20:27:46

相关推荐

  • Aurelia中检测变量值变化的实践指南

    本文深入探讨了在Aurelia框架中如何精确检测变量值的变化。通过利用Aurelia的BindingEngine及其propertyObserver机制,开发者可以订阅特定属性的值更新事件,从而在值从A到B变化时执行自定义逻辑。文章将详细介绍其使用方法、适用场景以及关键的注意事项,特别是它只能观察单…

    2025年12月22日
    000
  • Bootstrap Nav-Tab样式定制:深入理解CSS选择器与应用

    本文旨在解决Bootstrap导航标签(nav-tabs)样式定制中常见的CSS规则不生效问题。核心原因在于CSS选择器书写不当,特别是ID选择器与类选择器组合时,误用后代选择器导致样式无法正确应用到目标元素。通过理解并修正选择器语法,确保ID和类同时作用于同一元素,即可有效实现预期样式。 理解Bo…

    2025年12月22日
    000
  • HTML视频预览隐藏与按需显示教程

    本教程详细讲解如何在网页中实现视频预览的初始隐藏,并通过用户点击按钮来按需显示视频内容。我们将利用CSS的display属性进行初始设置,并结合JavaScript事件处理来动态切换视频的可见性,从而优化用户界面和加载体验。 理解视频的默认行为与按需显示的需求 在html中,标签默认情况下会显示视频…

    2025年12月22日
    000
  • 解决响应式导航栏下拉菜单点击失效问题

    本文旨在解决在使用 W3Schools 提供的响应式导航栏代码时,遇到的下拉菜单点击后不显示或消失的问题。我们将详细介绍问题的可能原因,并提供清晰的步骤和代码示例,帮助你修复导航栏的下拉菜单功能,确保在各种设备上都能正常工作。 问题分析 当响应式导航栏的下拉菜单点击后不显示,或者在滚动页面后消失时,…

    2025年12月22日
    000
  • JavaScript中动态获取过滤后元素的CSS选择器以供自动化工具使用

    本教程旨在解决在JavaScript中从一个NodeList中筛选出特定元素后,如何获取其CSS选择器字符串的问题,特别是为了满足Puppeteer等自动化工具对CSS选择器作为参数的需求。文章将介绍一种通过添加自定义数据属性(data-*)来标记目标元素,并据此构建稳定、可用的CSS选择器的方法。…

    2025年12月22日
    000
  • 解决Bootstrap Nav-Tab样式失效:CSS选择器特异性与正确实践

    本文探讨Bootstrap nav-tabs组件样式部分不生效的问题,主要归因于CSS选择器编写错误。通过详细分析#id .class与#id.class的区别,提供正确的选择器写法,并给出优化建议,确保样式准确应用,提升前端开发效率。 Bootstrap Nav-Tab样式失效的根源分析 在使用b…

    2025年12月22日
    000
  • JavaScript与CSS:为元素缩放添加平滑动画

    本文将指导读者如何使用JavaScript和CSS为网页元素(如圆形)实现平滑的缩放动画效果。文章强调应避免使用非标准的zoom属性,转而采用CSS的transform: scale()属性结合transition来创建流畅的动画,并提供详细的代码示例,确保跨浏览器兼容性和良好的用户体验。 1. 理…

    2025年12月22日
    000
  • 使用 transform 和 transition 实现元素平滑缩放动画

    本文详细介绍了如何利用 CSS 的 transform 属性进行元素缩放,并结合 transition 属性实现平滑的动画效果,以替代非标准的 zoom 属性。教程将通过具体的 HTML、CSS 和 JavaScript 代码示例,演示如何创建一个可点击放大并带有过渡动画的圆形元素,同时强调了 tr…

    2025年12月22日
    000
  • JavaScript中函数返回值与DOM内容显示的陷阱与解决方案

    本教程探讨JavaScript中将函数执行结果显示到DOM元素时常见的“undefined”问题。当函数直接操作DOM但未返回内容时,尝试将其返回值赋给innerHTML会导致错误。文章将提供两种解决方案:一是让函数返回需要显示的内容,二是让函数直接负责DOM更新,并相应调整调用逻辑,以确保动态内容…

    2025年12月22日
    000
  • 文本输入框是怎么制作的?INPUT标签的TYPE属性详解。

    文本输入框通过HTML的INPUT标签实现,type属性定义类型与行为,如text、password、email等,配合name、placeholder、required等属性提升功能与体验,结合autofocus、autocomplete和CSS、JavaScript优化交互,增强用户体验并减轻验…

    2025年12月22日
    000
  • VS Code更新后HTML Emmet ! 快捷键失效的替代方案

    本文针对VS Code更新后,HTML文件中Emmet ! 快捷键无法生成HTML5基础模板的问题,提供了 html:5 作为替代解决方案。通过简单输入 html:5 并回车,即可快速生成标准的HTML5文档结构,确保开发流程的顺畅,帮助开发者高效构建网页骨架。 1. 问题背景与现象 visual …

    2025年12月22日
    000
  • VS Code更新后HTML基础模板生成失效的解决方案

    本文针对VS Code更新后,用户发现HTML文件中Emmet的!快捷方式无法自动生成基础模板的问题,提供了一个简单有效的解决方案。我们将详细介绍如何通过使用html:5这一替代指令,快速恢复HTML文档结构的生成效率,确保开发工作流程的顺畅。 在日常的前端开发中,Visual Studio Cod…

    2025年12月22日
    000
  • Bootstrap Nav-tabs 样式失效问题排查与解决方案

    第一段引用上面的摘要:本文针对 Bootstrap 中使用 ID 选择器自定义 nav-tabs 样式时,部分 CSS 规则失效的问题进行了深入分析。通过剖析 CSS 选择器的优先级和作用域,明确了失效原因在于选择器的层级关系不正确。提供了精简有效的 CSS 解决方案,帮助开发者准确控制 nav-t…

    2025年12月22日
    000
  • html实时显示当前时间 html时间同步显示技巧

    使用JavaScript Date对象每秒更新页面时间显示;2. 通过调用公网API如worldtimeapi获取标准时间进行校准;3. 利用WebSocket接收服务器定时推送的精确时间实现高精度同步。 如果您希望在网页上实时显示当前时间,并确保时间同步准确,可以通过JavaScript结合HTM…

    2025年12月22日
    000
  • 优化ARIA实时区域:避免屏幕阅读器重复朗读动态内容

    本文深入探讨了在Web应用中使用ARIA role=”log”处理动态内容时,屏幕阅读器可能重复朗读的问题。核心在于屏幕阅读器监听DOM变化,而非文本内容差异。因此,清除并重新添加内容会导致重复朗读。解决方案是避免完全替换现有DOM元素,而是采用追加(append)新内容的方…

    2025年12月22日
    000
  • 使用 HTML、CSS 和 JavaScript 实现可搜索下拉列表并显示选中项

    本文档详细介绍了如何使用 HTML、CSS 和 JavaScript 创建一个动态可搜索的下拉列表,并实现选中项的显示功能。通过 JSON 数据动态生成下拉选项,并提供搜索过滤功能,最终将用户选择的条目信息展示出来。文章将提供完整的代码示例,并对关键步骤进行详细解释,帮助开发者快速掌握实现方法。 实…

    2025年12月22日
    000
  • 如何在HTML中隐藏视频预览并在用户交互后显示

    本教程详细介绍了如何在HTML页面中实现视频的按需显示。通过结合使用CSS的display: none属性初始化隐藏视频元素,并利用JavaScript监听用户点击事件,动态地将视频的display属性设置为block,从而在用户准备观看时才显示视频内容,有效优化页面加载和用户体验。 在网页开发中,…

    2025年12月22日
    000
  • VS Code HTML Emmet ! 失效解决方案:改用 html:5

    本文针对VS Code更新后,用户反映的Emmet ! 快捷键无法生成HTML基础骨架的问题,提供了一个直接有效的解决方案。当 ! 快捷方式不再奏效时,用户可以转而使用 html:5 这一Emmet缩写来快速生成标准的HTML5文档结构,确保开发流程的顺畅。 VS Code Emmet 快捷键失效问…

    2025年12月22日
    000
  • JavaScript:从数组动态生成带复选框的任务列表并实现每日更新

    本文旨在解决从数组动态生成带复选框的任务列表时遇到的常见问题,包括错误的数组定义、DOM元素创建与挂载不当,以及如何实现列表的每日动态更新。通过修正数组语法、优化DOM操作流程,并提供实现每日任务切换的策略,帮助开发者构建功能完善的交互式任务管理界面。 1. 理解问题核心:动态列表与复选框生成 在W…

    2025年12月22日
    000
  • CSS Grid容器居中对齐实践:Flexbox的巧妙应用

    本教程旨在解决CSS Grid布局中整个容器无法居中对齐的常见问题。通过将Grid容器的父元素设置为Flex容器,并应用justify-content: center;,可以轻松实现Grid容器在页面上的水平居中。文章将详细阐述其原理与实现步骤,并提供示例代码,帮助开发者高效解决布局难题。 CSS …

    2025年12月22日
    000

发表回复

登录后才能评论
关注微信