当前位置: 首页 > news >正文

【JavaEE进阶】Spring MVC(3)

欢迎关注个人主页:逸狼


创造不易,可以点点赞吗

如有错误,欢迎指出~


返回响应

返回静态页面

//@RestController
@Controller
@RequestMapping("/response")
public class ResponseController {@RequestMapping("/returnHtmlPage")public String returnHtmlPage(){return "/hello.html";}
}

创建前端页面hello.html(注意要放到static文件夹下面) 

@RestController = @Controller+@ResponseBody(返回数据

如果只加@Controller,返回的是视图页面,若加上@RestController,返回的就是数据了

@ResponseBody 既是类注解,又是方法注解,

  • 加在上,该类的所有方法都 返回数据,
  • 加在方法上,该方法 返回数据,其他方法不受影响

如果⼀个类的⽅法⾥,既有返回数据的,⼜有返回⻚⾯的,就把 @ResponseBody 注解添加到对应的⽅ 法上即可.

@Controller
public class IndexController {@RequestMapping("/index")public Object index(){return "/index.html";}@ResponseBody@RequestMapping("/returnData")public String returnData(){return "该⽅法返回数据";}
}

 如果将第二个方法returnDate中的注解@ResponseBody去掉,前端会报404的错误,因为程序会认为返回的是一个html页面,所以会在static文件夹找,没有找到就会报错

返回Html代码

后端数据中如果有html代码,会被浏览器解析

    //返回Html的代码@ResponseBody@RequestMapping("/returnHtml")public String returnHtml(){return "<h1>returnHtml</h1>";}

通过Fiddler观察响应结果, Content-Type 为 text/html

响应中的Content-Type常⻅取值有以下⼏种:

  1.  text/html :body数据格式是HTML
  2. text/css :body数据格式是CSS
  3. application/javascript :body数据格式是JavaScript
  4. application/json :body数据格式是JSON 

返回json数据

    //返回json@ResponseBody@RequestMapping("/returnJson")public User returnJson(){User user=new User();user.setName("zhangsan");user.setAge(18);return user;}

返回状态码 

SpringMVC会根据我们⽅法的返回结果⾃动设置响应状态码,程序员也可以⼿动指定状态码 通过SpringMVC的内置对象HttpServletResponse提供的⽅法来进⾏设置

    //设置状态码@ResponseBody@RequestMapping("/setStatus")public User returnJson(HttpServletResponse response){User user=new User();user.setName("zhangsan");user.setAge(18);response.setStatus(500);return user;}

状态码不影响界面的展示 

设置Header

    //设置header@ResponseBody@RequestMapping(value="/setHeader",produces="application/json")public String setHeader(){return "{\"success\":true}";}

方法二

设置其他Header的话,需要使⽤SpringMVC的内置对象HttpServletResponse提供的⽅法来进⾏设置

voidsetHeader(Stringname,Stringvalue)设置⼀个带有给定的名称和值的header.如果name 已经存在,则覆盖旧的值.

    @ResponseBody@RequestMapping("/setHeader2")public String setHeader(HttpServletResponse response){response.setHeader("myKey","myValue");return "success";}

小案例实践1:实现一个加法计算器

 约定前后端交互接⼝

约定"前后端交互接⼝"是进⾏Web开发中的关键环节. 接⼝⼜叫API(Application Programming Interface),我们⼀般讲到接⼝或者API,指的都是同⼀个东 西.(就是允许客⼾端给服务器发送哪些HTTP请求,并且每种请求预期获取什么样的HTTP响应.

接⼝,其实也就是我们前⾯⽹络模块讲的的"应⽤层协议".把约定的内容写在⽂档上,就是"接⼝⽂档",接⼝⽂档也可以理解为是应⽤程序的"操作说明书".

以实现上面的加法计数器 为例 

需求分析

加法计算器功能,对两个整数进⾏相加,需要客⼾端提供参与计算的两个数,服务端返回这两个整数计算 的结果

接⼝定义

  1.  请求路径:calc/sum
  2. 请求⽅式:GET/POST
  3. 接⼝描述:计算两个整数相加

请求参数

 响应数据

  1. Content-Type: text/html
  2. 响应内容: 计算机计算结果: 8

服务器给浏览器返回计算的结果

 后端服务器代码

@RestController
@RequestMapping("/calc")
public class CalcController {@RequestMapping("/sum")public String sum(@RequestParam("num1") Integer num1,@RequestParam("num2") Integer num2){Integer sum=num1 + num2 ;return "计算器计算结果:"+sum;}
}

前端calc.html代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body>
<form action="calc/sum" method="post"><h1>计算器</h1>数字1:<input name="num1" type="text"><br>数字2:<input name="num2" type="text"><br><input type="submit" value=" 点击相加 ">
</form>
</body></html>

要记得将前端代码放到static文件夹下 

小案例实践2:⽤⼾登录 

需求分析

⽤⼾输⼊账号和密码, 后端进⾏校验密码是否正确

 1. 如果不正确,前端进⾏⽤⼾告知

2. 如果正确,跳转到⾸⻚.⾸⻚显⽰当前登录⽤⼾

3. 后续再访问⾸⻚,可以获取到登录⽤⼾信息

校验接口 

接口定义

  1. 请求路径:/user/login
  2. 请求⽅式:POST
  3. 接⼝描述:校验账号密码是否正确

响应数据

  1. Content-Type: text/html
  2. 响应内容: true //账号密码验证成功
  3. false//账号密码验证失败

 后端代码实现

@RequestMapping("/user")
@RestController
public class UserController {@RequestMapping(value="/login",method= RequestMethod.POST)public Boolean login(String userName, String password, HttpSession session){//如果有session则返回,没有就创建
//        if(userName==null || "".equals(userName)){//将常量写在前面,防止userName为空,会报空指针异常
//            return false;
//        }//如果用户名和密码两者有一个为空,if(!StringUtils.hasLength(userName) || !StringUtils.hasLength(password)){return false;}//不为空,校验账号和密码是否正确if("admin".equals(userName) && "admin".equals(password)){//登入成功,要设置session,把⽤⼾名存储在Session中 session.setAttribute("userName",userName);return true;}return false;//尽可能少些嵌套}

查询用户登入接口

接口定义

  1. 请求路径:/user/getLoginUser
  2. 请求⽅式:GET
  3. 接⼝描述:查询当前登录的⽤⼾

响应数据

  1. Content-Type: text/html
  2. 响应内容: zhangsan

返回当前登录的⽤⼾

 后端代码实现

@RequestMapping(value="/getLoginUser",method= RequestMethod.GET)public String getLoginUser(HttpSession session){if(session.getAttribute("userName")!= null){return (String) session.getAttribute("userName");}return "";}

前端login.html代码

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>登录页面</title>
</head><body>
<h1>用户登录</h1>
用户名:<input name="userName" type="text" id="userName"><br>
密码:<input name="password" type="password" id="password"><br>
<input type="button" value="登录" onclick="login()"><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script>function login() {$.ajax({type: "post",url: "/user/login",data: {"userName": $("#userName").val(),"password": $("#password").val()},success: function(body){if(body==true){//跳转到index页面location.href = "index.html";}else{//当前页面alert("密码错误");}}});}</script>
</body></html>

前端index.html代码 

<!doctype html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport"content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>用户登录首页</title>
</head><body>
登录人: <span id="loginUser"></span><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script>$.ajax({type: "get",url: "/user/getLoginUser",success: function(userName){$("#loginUser").text(userName);}});</script>
</body></html>

在浏览器中测试的结果如下

小案例实践3:留言板

需求分析

 后端需要提供两个服务

1. 提交留⾔:⽤⼾输⼊留⾔信息之后,后端需要把留⾔信息保存起来

 2. 展⽰留⾔:⻚⾯展⽰时,需要从后端获取到所有的留⾔信息

 创建MessageInfo类

@Data//来自lombok,加上后不用写get和set方法了(自动帮助生成get和set方法)
public class MessageInfo {public String from;public String to;public String message;
}

 接⼝定义

1. 获取全部留⾔

全部留⾔信息,我们⽤List来表⽰,可以⽤JSON来描述这个List数据.接口定义

2. 发表新留⾔

请求:body也为JSON格式.

后端代码实现 

@RestController
@RequestMapping("/message")
public class MessageController {//存储留言信息private List<MessageInfo> messageInfos=new ArrayList<>();@RequestMapping("/getList")public List<MessageInfo> getList(){return messageInfos;}//发表留言@RequestMapping(value = "/publish",produces = "application/json")//设置返回结果为jsonpublic String publish(@RequestBody MessageInfo messageInfo){if(StringUtils.hasLength(messageInfo.getFrom())&& StringUtils.hasLength(messageInfo.getTo())&& StringUtils.hasLength(messageInfo.getMessage())){messageInfos.add(messageInfo);return "{\"ok\":1}";}//发布失败return "{\"ok\":0}";}
}

前端代码实现

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>留言板</title><style>.container {width: 350px;height: 300px;margin: 0 auto;/*水平方向居中*//* border: 1px black solid; */text-align: center;}.grey {color: grey;}.container .row {width: 350px;height: 40px;display: flex;justify-content: space-between;align-items: center;}.container .row input {width: 260px;height: 30px;}#submit {width: 350px;height: 40px;background-color: orange;color: white;border: none;margin: 10px;border-radius: 5px;font-size: 20px;}</style>
</head><body><div class="container"><h1>留言板</h1><p class="grey">输入后点击提交, 会将信息显示下方空白处</p><div class="row"><span>谁:</span> <input type="text" name="" id="from"></div><div class="row"><span>对谁:</span> <input type="text" name="" id="to"></div><div class="row"><span>说什么:</span> <input type="text" name="" id="say"></div><input type="button" value="提交" id="submit" onclick="submit()"><!-- <div>A 对 B 说: hello</div> --></div><script src="https://code.jquery.com/jquery-3.7.1.min.js"></script><script>getList();function getList() {$.ajax({type: "get",url: "/message/getList",success: function (messages) {for (let msg of messages) {let html = "<div>" + msg.from + " 对 " + msg.to + " 说: " + msg.message + "</div>";$(".container").append(html);}}});}function submit() {let from = $("#from").val();let to = $("#to").val();let say = $("#say").val();if (from == "" || to == "" || say == "") {alert("请检查输入内容");return;}//检验完成之后, 发起后端请求$.ajax({url: "/message/publish",type: "post",// 设置Request ContentTypecontentType: "application/json",// 将对象转为jsondata: JSON.stringify({from: from,to: to,message: say}),success: function (result) {if (result.ok == 1) {//添加成功alert("添加成功");let html = "<div>" + from + " 对 " + to + " 说: " + say + "</div>";$(".container").append(html);$(":text").val("");} else {//失败alert("添加失败");}}});}</script>
</body></html>

引入lombok

Lombok是⼀个Java⼯具库,通过添加注解的⽅式,简化Java的开发.

lombok通过⼀些注解的⽅式,可以帮助我们消除⼀些冗⻓代码,使代码看起来简洁⼀些

在pom文件里加上lombok依赖

        <dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId><optional>true</optional></dependency>

相关文章:

【JavaEE进阶】Spring MVC(3)

欢迎关注个人主页&#xff1a;逸狼 创造不易&#xff0c;可以点点赞吗 如有错误&#xff0c;欢迎指出~ 返回响应 返回静态页面 //RestController Controller RequestMapping("/response") public class ResponseController {RequestMapping("/returnHtmlPage&…...

30 款 Windows 和 Mac 下的复制粘贴软件对比

在日常电脑操作中&#xff0c;复制粘贴是极为高频的操作&#xff0c;一款好用的复制粘贴软件能极大提升工作效率。以下为你详细介绍 30 款 Windows 和 Mac 下的复制粘贴软件&#xff0c;并对比它们的优缺点&#xff0c;同时附上官网下载地址&#xff0c;方便大家获取软件。 Pa…...

【LLAMA】羊驼从LLAMA1到LLAMA3梳理

every blog every motto: Although the world is full of suffering&#xff0c; it is full also of the overcoming of it 0. 前言 LLAMA 1到3梳理 1. LLAMA 1 论文&#xff1a; LLaMA: Open and Efficient Foundation Language Models 时间&#xff1a; 2023.02 1.1 前言…...

【OS安装与使用】part3-ubuntu安装Nvidia显卡驱动+CUDA 12.4

文章目录 一、待解决问题1.1 问题描述1.2 解决方法 二、方法详述2.1 必要说明2.2 应用步骤2.2.1 更改镜像源2.2.2 安装NVIDIA显卡驱动&#xff1a;nvidia-550&#xff08;1&#xff09;查询显卡ID&#xff08;2&#xff09;PCI ID Repository查询显卡型号&#xff08;3&#xf…...

【蓝桥杯集训·每日一题2025】 AcWing 6123. 哞叫时间 python

6123. 哞叫时间 Week 1 2月18日 农夫约翰正在试图向埃尔茜描述他最喜欢的 USACO 竞赛&#xff0c;但她很难理解为什么他这么喜欢它。 他说「竞赛中我最喜欢的部分是贝茜说 『现在是哞哞时间』并在整个竞赛中一直哞哞叫」。 埃尔茜仍然不理解&#xff0c;所以农夫约翰将竞赛以…...

JAVA中常用类型

一、包装类 1.1 包装类简介 java是面向对象的语言&#xff0c;但是八大基本数据类型不符合面向对象的特征。因此为了弥补这种缺点&#xff0c;为这八中基本数据类型专门设计了八中符合面向面向对象的特征的类型&#xff0c;这八种具有面向对象特征的类型&#xff0c;就叫做包…...

【办公类-90-02】】20250215大班周计划四类活动的写法(分散运动、户外游戏、个别化综合)(基础列表采用读取WORD表格单元格数据,非采用切片组合)

背景需求&#xff1a; 做了中班的四类活动安排表&#xff0c;我顺便给大班做一套 【办公类-90-01】】20250213中班周计划四类活动的写法&#xff08;分散运动、户外游戏、个别化&#xff08;美工室图书吧探索室&#xff09;&#xff09;-CSDN博客文章浏览阅读874次&#xff0…...

求矩阵对角线元素的最大值

求主对角线元素的最大值时&#xff0c;让指针指向A[N-1][N-1]&#xff0c;指针以(N1)为单位递增&#xff0c;就可以指向对角线每个元素&#xff1b; 求次对角线元素的最大值时&#xff0c;让指针指向A[0][N-1]&#xff0c;指针以(N-1)为单位递增&#xff0c;就可以指向副对角线…...

NoSQL之redis数据库

案例知识 关系与分关系型数据库 关系型数据库&#xff1a;Oracle&#xff0c;MySQL&#xff0c;SQL Server 非关系型数据库&#xff1a;Redis&#xff0c;MongDB Redis文件路径 配置文件&#xff1a;/etc/redis/6379.conf 日志文件&#xff1a;/var/log/redis_6379.log 数据文…...

【R语言】非参数检验

一、Mann-Whitney检验 在R语言中&#xff0c;Mann-Whitney U检验&#xff08;也称为Wilcoxon秩和检验&#xff09;用于比较两个独立样本的中位数是否存在显著差异。它是一种非参数检验&#xff0c;适用于数据不满足正态分布假设的情况。 1、独立样本 # 创建两个独立样本数据…...

【力扣Hot 100】栈

1. 有效的括号 给定一个只包括 (&#xff0c;)&#xff0c;{&#xff0c;}&#xff0c;[&#xff0c;] 的字符串 s &#xff0c;判断字符串是否有效。 有效字符串需满足&#xff1a; 左括号必须用相同类型的右括号闭合。左括号必须以正确的顺序闭合。每个右括号都有一个对应…...

HTTP 与 HTTPS:协议详解与对比

文章目录 概要 一. HTTP 协议 1.1 概述 1.2 工作原理 1.3 请求方法 1.4 状态码 二. HTTPS 协议 2.1 概述 2.2 工作原理 2.3 SSL/TLS 协议 2.4 证书 三. HTTP 与 HTTPS 的区别 四. 应用场景 4.1 HTTP 的应用场景 4.2 HTTPS 的应用场景 概要 HTTP&#xff08;Hy…...

C++编程语言:抽象机制:模板和层级结构(Bjarne Stroustrup)

目录 27.1 引言(Introduction) 27.2 参数化和层级结构(Parameterization and Hierarchy) 27.2.1 生成类型(Generated Types) 27.2.2 模板转换(Template Conversions) 27.3 类模板层级结构(Hierarchies of Class Templates) 27.3.1 模板对比接口(Templates as Interf…...

建筑兔零基础自学python记录22|实战人脸识别项目——视频人脸识别(下)11

这次我们继续解读代码&#xff0c;我们主要来看下面两个部分&#xff1b; 至于人脸识别成功的要点我们在最后总结~ 具体代码学习&#xff1a; #定义人脸名称 def name():#预学习照片存放位置path M:/python/workspace/PythonProject/face/imagePaths[os.path.join(path,f) f…...

在使用export default 导出时,使用的components属性的作用?

文章目录 析与思考回答 析与思考 在 Vue.js 中&#xff0c;使用 export default 导出组件时&#xff0c;通常会通过 components 选项将子组件也导出出来&#xff08;其实是将子组件进行局部注册&#xff09; 。这涉及到 Vue.js 组件的注册机制。为了更清晰地理解这个问题&…...

以太网交换基础(涵盖二层转发原理和MAC表的学习)

在当今的网络世界中&#xff0c;以太网交换技术是局域网&#xff08;LAN&#xff09;的核心组成部分。无论是企业网络、学校网络还是家庭网络&#xff0c;以太网交换机都扮演着至关重要的角色。本文将详细介绍以太网交换的基础知识&#xff0c;包括以太网协议、帧格式、MAC地址…...

Vue 实现通过URL浏览器本地下载 PDF 和 图片

1、代码实现如下&#xff1a; 根据自己场景判断 PDF 和 图片&#xff0c;下载功能可按下面代码逻辑执行 const downloadFile async (item: any) > {try {let blobUrl: any;// PDF本地下载if (item.format pdf) {const response await fetch(item.url); // URL传递进入i…...

【2025最新计算机毕业设计】基于SpringBoot+Vue非遗传承与保护研究系统【提供源码+答辩PPT+文档+项目部署】

作者简介&#xff1a;✌CSDN新星计划导师、Java领域优质创作者、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行前辈交流。✌ 主要内容&#xff1a;&#x1f31f;Java项目、Python项目、前端项目、PHP、ASP.NET、人工智能…...

组合总和力扣--39

目录 题目 思路 剪枝优化 代码 题目 给你一个 无重复元素 的整数数组 candidates 和一个目标整数 target &#xff0c;找出 candidates 中可以使数字和为目标数 target 的 所有 不同组合 &#xff0c;并以列表形式返回。你可以按 任意顺序 返回这些组合。 candidates 中的…...

echarts tooltip高亮某个值,某一项选中高亮状态

需求&#xff1a; 当有多组数据的时候&#xff0c;常常需要对比同一x轴的不同线上的点的数据&#xff0c;并且当数据组过多的时候&#xff0c;也就是线过多的时候&#xff0c;需要明确知道我们当前选中的线是哪条。 解决方案&#xff1a; 通过设置显示x轴的tooltip可以显示同…...

AI-调查研究-01-正念冥想有用吗?对健康的影响及科学指南

点一下关注吧&#xff01;&#xff01;&#xff01;非常感谢&#xff01;&#xff01;持续更新&#xff01;&#xff01;&#xff01; &#x1f680; AI篇持续更新中&#xff01;&#xff08;长期更新&#xff09; 目前2025年06月05日更新到&#xff1a; AI炼丹日志-28 - Aud…...

Cursor实现用excel数据填充word模版的方法

cursor主页&#xff1a;https://www.cursor.com/ 任务目标&#xff1a;把excel格式的数据里的单元格&#xff0c;按照某一个固定模版填充到word中 文章目录 注意事项逐步生成程序1. 确定格式2. 调试程序 注意事项 直接给一个excel文件和最终呈现的word文件的示例&#xff0c;…...

RocketMQ延迟消息机制

两种延迟消息 RocketMQ中提供了两种延迟消息机制 指定固定的延迟级别 通过在Message中设定一个MessageDelayLevel参数&#xff0c;对应18个预设的延迟级别指定时间点的延迟级别 通过在Message中设定一个DeliverTimeMS指定一个Long类型表示的具体时间点。到了时间点后&#xf…...

利用ngx_stream_return_module构建简易 TCP/UDP 响应网关

一、模块概述 ngx_stream_return_module 提供了一个极简的指令&#xff1a; return <value>;在收到客户端连接后&#xff0c;立即将 <value> 写回并关闭连接。<value> 支持内嵌文本和内置变量&#xff08;如 $time_iso8601、$remote_addr 等&#xff09;&a…...

QMC5883L的驱动

简介 本篇文章的代码已经上传到了github上面&#xff0c;开源代码 作为一个电子罗盘模块&#xff0c;我们可以通过I2C从中获取偏航角yaw&#xff0c;相对于六轴陀螺仪的yaw&#xff0c;qmc5883l几乎不会零飘并且成本较低。 参考资料 QMC5883L磁场传感器驱动 QMC5883L磁力计…...

【大模型RAG】Docker 一键部署 Milvus 完整攻略

本文概要 Milvus 2.5 Stand-alone 版可通过 Docker 在几分钟内完成安装&#xff1b;只需暴露 19530&#xff08;gRPC&#xff09;与 9091&#xff08;HTTP/WebUI&#xff09;两个端口&#xff0c;即可让本地电脑通过 PyMilvus 或浏览器访问远程 Linux 服务器上的 Milvus。下面…...

华硕a豆14 Air香氛版,美学与科技的馨香融合

在快节奏的现代生活中&#xff0c;我们渴望一个能激发创想、愉悦感官的工作与生活伙伴&#xff0c;它不仅是冰冷的科技工具&#xff0c;更能触动我们内心深处的细腻情感。正是在这样的期许下&#xff0c;华硕a豆14 Air香氛版翩然而至&#xff0c;它以一种前所未有的方式&#x…...

Python ROS2【机器人中间件框架】 简介

销量过万TEEIS德国护膝夏天用薄款 优惠券冠生园 百花蜂蜜428g 挤压瓶纯蜂蜜巨奇严选 鞋子除臭剂360ml 多芬身体磨砂膏280g健70%-75%酒精消毒棉片湿巾1418cm 80片/袋3袋大包清洁食品用消毒 优惠券AIMORNY52朵红玫瑰永生香皂花同城配送非鲜花七夕情人节生日礼物送女友 热卖妙洁棉…...

CSS设置元素的宽度根据其内容自动调整

width: fit-content 是 CSS 中的一个属性值&#xff0c;用于设置元素的宽度根据其内容自动调整&#xff0c;确保宽度刚好容纳内容而不会超出。 效果对比 默认情况&#xff08;width: auto&#xff09;&#xff1a; 块级元素&#xff08;如 <div>&#xff09;会占满父容器…...

Spring AI Chat Memory 实战指南:Local 与 JDBC 存储集成

一个面向 Java 开发者的 Sring-Ai 示例工程项目&#xff0c;该项目是一个 Spring AI 快速入门的样例工程项目&#xff0c;旨在通过一些小的案例展示 Spring AI 框架的核心功能和使用方法。 项目采用模块化设计&#xff0c;每个模块都专注于特定的功能领域&#xff0c;便于学习和…...