Spring Boot管理用户数据

目录

  • 学习目标
  • 前言
  • Thymeleaf 模板JSON 数据
      • 步骤 1: 创建 Spring Boot 项目
        • 使用 Spring Initializr 创建项目
        • 使用 IDE 创建项目
      • 步骤 2: 添加依赖
      • 步骤 3: 创建 Controller
      • 步骤 4: 新建index页面
      • 步骤 5: 运行应用程序
  • 表单提交
      • 步骤 1: 添加 Thymeleaf 依赖
        • 在 Maven 中添加依赖
      • 步骤2:创建实体类
      • 步骤 3: 创建 Controller 处理表单请求
      • 步骤 3: 创建 Thymeleaf 模板文件
        • `login.html`
        • `result.html`
      • 步骤 4: 运行应用程序
  • Spring Boot 处理JSON 数据的过程
      • 1.创建实体类
      • 2.创建视图页面
      • 3.控制器
      • 4.运行
  • 总结

学习目标

Spring Boot 的 Web 的开发

  • Thymeleaf 模板JSON 数据

前言

前端开发,也称为客户端开发,专注于用户界面和用户体验。后端开发,或服务器端开发,处理服务器、应用程序和数据库的逻辑。Web开发可以分为两大主要领域:前端开发和后端开发


Thymeleaf 模板JSON 数据

Thymeleaf 是一个的Java模板引擎,具备生成多种文本格式的能力,包括HTML、XML、JavaScript、CSS以及简单的纯文本。

创建一个基于 Thymeleaf 模板的 Spring Boot Web 应用程序相对简单。

步骤 1: 创建 Spring Boot 项目

首先,你需要创建一个新的 Spring Boot 项目。你可以通过 Spring Initializr 网站来创建,或者使用 IDE 如 IntelliJ IDEA 或 Eclipse。

使用 Spring Initializr 创建项目
  1. 访问 Spring Initializr。
  2. 选择项目元数据:
    • Project:Maven Project 或 Gradle Project
    • Language:Java
    • Packaging:Jar
    • Java:选择你安装的 Java 版本
  3. 添加依赖项:
    • Spring Web
    • Thymeleaf
  4. 选择默认的其他选项,点击生成按钮下载项目。
    在这里插入图片描述
    我尝试更换Java版本,在IDEA中使用JDK1.8时一切正常,但当我切换到JDK17时遇到了错误。

为了解决这个问题,我选择了一个曲线救国的方法:回退版本。

我将父类依赖从3.3.4降低到了2.6.4。(避免报错,在我的电脑)
在这里插入图片描述

使用 IDE 创建项目

如果你使用的是支持 Spring Boot 的 IDE,可以在 IDE 中新建一个 Spring Boot 项目,并添加上述依赖。

步骤 2: 添加依赖

在这里插入图片描述

如果你使用的是 Maven,确保在 pom.xml 文件中添加以下依赖:

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

步骤 3: 创建 Controller

接下来,创建一个简单的控制器来处理 HTTP 请求:

package com.bushuo.demo01.controller;import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;@Controller
public class TestThymeleafController {@RequestMapping("/index")public String test(){//返回src/main/resources/templates/index.htmlreturn "index";}
}

步骤 4: 新建index页面

src/main/resources/templates 目录下创建一个名为 index.html 的文件,并添加以下内容:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<h1 >Welcome to Spring Boot!</h1>
</body>
</html>

步骤 5: 运行应用程序

现在,你可以运行你的 Spring Boot 应用了。在终端或命令提示符中,导航到项目的根目录并执行以下命令:

mvn spring-boot:run

或者在 IDE 中直接运行主类(通常包含 @SpringBootApplication 注解)。

在这里插入图片描述

表单提交

在 Spring Boot 应用程序中使用 Thymeleaf 实现表单提交及数据绑定的过程主要包括以下几个步骤:

  1. 添加 Thymeleaf 依赖
  2. 创建 Controller 处理表单请求
  3. 创建 Thymeleaf 模板文件
  4. 运行应用程序

步骤 1: 添加 Thymeleaf 依赖

确保项目已经包含了 Thymeleaf 依赖。如果你还没有添加,请参考之前的指导在 pom.xml 中添加相应的依赖。

在 Maven 中添加依赖
<dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId></dependency><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId></dependency>
</dependencies>

步骤2:创建实体类

在src/main/java 目录下,创建model包,创建实体类loginBean
在这里插入图片描述

package com.bushuo.demo01.model;public class LoginBean {String name;String role;public LoginBean() {}public String getName() {return name;}public void setName(String name) {this.name = name;}public String getRole() {return role;}public void setRole(String role) {this.role = role;}
}

步骤 3: 创建 Controller 处理表单请求

创建一个控制器来处理表单,并实现数据绑定。
在这里插入图片描述

步骤 3: 创建 Thymeleaf 模板文件

在src/main/resources/templates 目录下
创建两个 Thymeleaf 模板文件:一个用于显示表单 (login.html),另一个用于展示提交后的结果 (result.html)。

login.html

在这里插入图片描述

result.html

在这里插入图片描述

这个模板用于展示表单提交的结果,并提供一个返回按钮让用户回到表单页面。
在application.yml,

在这里插入图片描述

spring:thymeleaf:encoding: UTF-8#开发时关闭缓存(模板只加载一次),不然没法看到实时页面需要重构或重启cache: falseprefix: classpath:/templates/  #(默认)suffix: .html

步骤 4: 运行应用程序

运行你的 Spring Boot 应用程序,打开浏览器并访问 http://localhost:8080/toLogin,你应该能看到表单页面。填写用户名和电子邮件地址并提交表单后,你会看到结果页面,并且可以通过返回按钮回到表单页面。
在这里插入图片描述
在这里插入图片描述

Spring Boot 处理JSON 数据的过程

1.创建实体类

在com.bushuo.demo01包中,创建一个实体类来表示要处理的 JSON 数据。例如,创建一个 Person 类:
在这里插入图片描述

2.创建视图页面

在src/main/resources/templates 目录下,创建视图页面input.html.
在这里插入图片描述

3.控制器

在这里插入图片描述

4.运行

在这里插入图片描述
在这里插入图片描述

总结

通过这些步骤,可以在 Spring Boot 应用程序中使用 Thymeleaf 创建一个简单的表单,并处理表单提交的数据。可以根据实际需求进一步扩展这个示例,例如添加更多的表单字段、进行更复杂的表单验证、使用数据库存储数据等。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/147556.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

Github 2024-09-22 php开源项目日报 Top10

根据Github Trendings的统计,今日(2024-09-22统计)共有10个项目上榜。根据开发语言中项目的数量,汇总情况如下: 开发语言项目数量PHP项目10Blade项目1Coolify: 开源自助云平台 创建周期:1112 天开发语言:PHP, Blade协议类型:Apache License 2.0Star数量:10527 个Fork数量…

串的存储实现方法(与链表相关)

一、 定义 字符串是由零个&#xff08;空串&#xff09;或多个字符组成的有限序列。 eg:S"Hello World!" 串相等&#xff1a;两个串长度相等并且对应位置的字符都相等时&#xff0c;两个串才相等。 二、串的存储实现 2.1 定长顺序串 2.2 堆串 和定长顺序串的…

nodejs 014: React.FC 与 Evergreen(常青树) React UI 框架的的Dialog组件

React.FC React.FC是React中用于定义函数组件“Function Component”的类型。它代表&#xff0c;可以帮助你在TypeScript中提供类型检查和自动补全。使用React.FC时&#xff0c;可以明确指定组件的props类型&#xff0c;并且它会自动推导children属性。下面是一个使用 React.F…

二、MySQL环境搭建

文章目录 1. MySQL的卸载步骤1&#xff1a;停止MySQL服务步骤2&#xff1a;软件的卸载步骤3&#xff1a;残余文件的清理步骤4&#xff1a;清理注册表&#xff08;选做&#xff09;步骤5&#xff1a;删除环境变量配置 2. MySQL的下载、安装、配置2.1 MySQL的4大版本2.2 软件的下…

Ubuntu以及ROS的一些方便设置及使用

目录 增加环境变量 取消终端sudo密码 关闭开机密码 编写sh文件 虚拟环境的启用与关闭 launch文件小技巧 增加环境变量 1.在home目录下按ctrlh打开隐藏文件&#xff0c;打开.bashrc直接修改即可 2.输入gedit/vim ~/.bashrc修改即可 对于source ~/.bashrc这条指令只是适用…

从零开始讲DDR(5)——读懂Datasheet

对于开发人员来说&#xff0c;需要根据实际场景和使用的需要&#xff0c;使用不同厂家&#xff0c;不同型号的DDR&#xff0c;虽然原理上大同小异&#xff0c;但是还是有一些细节上的需要注意的地方&#xff0c;接触一个新的DDR芯片&#xff0c;首先就是需要找到对应的datashee…

软考高级:系统安全分析与设计- 加密管理:PKI 和 KMI 区别

讲解 PKI&#xff08;公钥基础设施&#xff09;和 KMI&#xff08;密钥管理基础设施&#xff09;都是与加密和密钥管理相关的重要概念&#xff0c;但它们有不同的侧重点。接下来&#xff0c;我将通过一个生活化的例子和概念讲解&#xff0c;帮助你理解它们的区别。 生活化例子…

【redis-02】深入理解redis中RBD和AOF的持久化

redis系列整体栏目 内容链接地址【一】redis基本数据类型和使用场景https://zhenghuisheng.blog.csdn.net/article/details/142406325【二】redis的持久化机制和原理https://zhenghuisheng.blog.csdn.net/article/details/142441756 如需转载&#xff0c;请输入&#xff1a;htt…

[Java EE] 网络原理 ---- UDP协议 序列化 / 反序列化 长短连接

Author&#xff1a;MTingle major:人工智能 Build your hopes like a tower! 文章目录 文章目录 一. UDP 协议 1.UDP协议的特点 2. UDP 的结构 3. md5算法 二. 长短连接 协程 IO多路复用 序列化和反序列化 1.长短连接 2. 协程 3. IO 多路复用 4.序列化 / 反序列化 一…

队列+宽搜专题篇

目录 N叉树的层序遍历 二叉树的锯齿形层序遍历 二叉树最大宽度 在每个树行中找最大值 N叉树的层序遍历 题目 思路 使用队列层序遍历来解决这道题&#xff0c;首先判断根节点是否为空&#xff0c;为空则返回空的二维数组&#xff1b;否则&#xff0c;就进行层序遍历&#x…

论文阅读 | 可证安全隐写(网络空间安全科学学报 2023)

可证安全隐写&#xff1a;理论、应用与展望 一、什么是可证安全隐写&#xff1f; 对于经验安全的隐写算法&#xff0c;即使其算法设计得相当周密&#xff0c;隐写分析者&#xff08;攻击者&#xff09;在观察了足够数量的载密&#xff08;含有隐写信息的数据&#xff09;和载体…

6.数据库-数据库设计

6.数据库-数据库设计 文章目录 6.数据库-数据库设计一、设计数据库的步骤二、绘制E-R图三、关系模式第一范式 (1st NF)第二范式 (2nd NF)第三范式 (3nd NF)规范化和性能的关系 一、设计数据库的步骤 收集信息 与该系统有关人员进行交流、座谈&#xff0c;充分了解用户需求&am…

Vulkan 学习(9)---- vkSuraceKHR 创建

目录 OverView创建窗口表面参考代码 OverView Vulkan 是一个平台无关的图形API&#xff0c;这意味着它不能直接与特定的窗口系统(Windows&#xff0c;linux 和 macOS 的窗口系统)进行交互 为了解决这个问题&#xff0c;Vulkan 引入了窗口系统集成(Window System Intergration …

DOM【JavaScript】

在JavaScript中&#xff0c;DOM (Document Object Model&#xff1a;文档对象模型) 是web页面的编程接口&#xff0c;用于表示和操作 HTML 和 XML 文档。它将文档结构化为一个树形结构&#xff0c;允许开发者通过 JavaScript 访问和修改网页的内容、结构和样式。以下是一些关于…

基于单片机的智能校园照明系统

由于校园用电量较大&#xff0c;本设计可以根据实际环境情况的改变&#xff0c;实现实时照明的控制。本设计以单片机芯片为控制芯片&#xff0c;热释电传感器采集教室中学生出入的信息&#xff0c;并把信息传递给单片机芯片&#xff0c;单片机芯片根据传感器传递过来的信息来控…

【软件测试】Bug 篇

哈喽&#xff0c;哈喽&#xff0c;大家好~ 我是你们的老朋友&#xff1a;保护小周ღ 今天给大家带来的是 【软件测试】Bug 篇&#xff0c;首先了解, 什么是Bug, 如何定义一个Bug, 如何描述一个 Bug, Bug的级别, 和 Bug 的生命周期, 以及测试人员跟开发人员产生争执如何处理,…

【MYSQL】聚合查询、分组查询、联合查询

目录 聚合查询聚合函数count()sum()avg()max()和min()总结 分组查询group by 子句having 子句 联合查询笛卡尔积内连接外连接自连接子查询单行子查询多行子查询from子句使用子查询 合并查询 聚合查询 聚合查询就是针对表中行与行之间的查询。 聚合函数 count() count(列名)&a…

个人随想-代码生成工具v0+claude+cursor

cursor出来已经有一段时间了&#xff0c;不知道大家用了感觉怎么样。今天就以我个人为例&#xff0c;给大家介绍一下我是如何使用cursor搭建原型。 首先&#xff0c;我并不觉得cursor对于后端程序员带来了革命性改进&#xff0c;我们与很多团队沟&#xff0c;使用cursor80%以上…

spring中的容器接口的实现类和功能

容器实现 BeanFactory 实现 这里我们就来一步步实现BeanFactory的功能。 首先创建我们需要的类 Configuration static class Config{Beanpublic Bean1 bean1(){return new Bean1();}Beanpublic Bean2 bean2(){return new Bean2();}}static class Bean1{private static fina…

【Linux】Shell 编程规范及检查工具推荐

本文内容均来自个人笔记并重新梳理&#xff0c;如有错误欢迎指正&#xff01; 如果对您有帮助&#xff0c;烦请点赞、关注、转发、订阅专栏&#xff01; 专栏订阅入口 | 精选文章 | Kubernetes | Docker | Linux | 羊毛资源 | 工具推荐 | 往期精彩文章 【Docker】&#xff08;全…