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

【Java EE进阶 --- SpringBoot】Spring Web MVC(Spring MVC)（二）

news 2025/8/31 8:53:59

乐观学习，乐观生活，才能不断前进啊！！！

我的主页：optimistic_chen

我的专栏：c语言 ，Java,
Java EE初阶， Java数据结构

欢迎大家访问~
创作不易，大佬们点赞鼓励下吧~

文章目录

  • 响应
    • 返回静态页面
    • 返回HTML代码
    • 返回JSON
    • 设置状态码
  • 案例练习
    • 用户登录
      • 后端代码：
      • 前端代码：
    • 留言板
      • 后端代码
      • 前端代码
  • 完结

响应

返回静态页面

创建前端页面test.html，那么Spring MVC要如何识别它是一个前端页面而不是字符串呢？
首先准备好前端代码：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<h1>我是h1</h1>
</body>
</html>

后端返回代码：

@RequestMapping("/resp")
@RestController
public class RespController {/*返回页面return 页面*/@RequestMapping("/r1")public String returnPage(){return "/test.html";}
}

在这里插入图片描述
观察图片，我们需要的是test页面，都是浏览器返回的却是字符串，注意，这时需要我们改动一下@RestController注解

@RequestMapping("/resp")
@Controller
public class RespController {/*返回页面return 页面*/@RequestMapping("/r1")public String returnPage(){return "/test.html";}
}

在这里插入图片描述
这时我们顺利得到了前端页面，那么这两个注解有什么样的区别呢？
观察两个注解的源码：
在这里插入图片描述
我们@RestController注解是包含@Controller注解的；
@Controller : 定义⼀个控制器,Spring框架启动时加载,把这个对象交给Spring管理.
@ResponseBody : 定义返回的数据格式为⾮视图,返回⼀个text/html信息,也就是数据
很明显，如果只是要视图的话，只需要把@ResponseBody去掉就可以了，也就是@Controller

返回HTML代码

后端返回数据时，如果数据中有HTML代码，浏览器也会解析

    @ResponseBody@RequestMapping("/r3")public String returnHTML(){return "<h1>我是一级标题</h1>";}

在这里插入图片描述
网络中的响应格式有Content-Type,展示了响应的body数据格式。
根据Fiddler抓包发现：说明当前为html格式
在这里插入图片描述

返回JSON

后端方法返回一个对象

    @ResponseBody@RequestMapping(value="/r5")public UserInfo returnJson(){UserInfo userInfo=new UserInfo("zhangsan",1,1);return userInfo;}

在这里插入图片描述
在这里插入图片描述
观察抓包，格式为json.

设置状态码

Spring MVC会根据我们⽅法的返回结果⾃动设置响应状态码,程序员也可以⼿动指定状态码

    @ResponseBody@RequestMapping(value="/r6")public UserInfo setStatus(HttpServletResponse response){response.setStatus(200);UserInfo userInfo=new UserInfo("zhangsan",1,1);return userInfo;}

在这里插入图片描述
抓包发现，状态码正是200.

案例练习

用户登录

用户输入账号和密码后，后端进行校验；如果不正确，前端进行用户告知；如果准确，跳转页面，显示当前登录用户。

后端代码：

登录校验

    @RequestMapping("/login")public Boolean login(String userName,String password,HttpSession session){//账号或密码为空if(!StringUtils.hasLength(userName)||!StringUtils.hasLength(password)){return false;}//先把密码和账号写死if("admin".equals(userName)&&"admin".equals(password)){//验证成功，把用户名存在Session中session.setAttribute("userName",userName);return true;}return false;}

查询登录

@RequestMapping("getLongin")public String getLongin(HttpSession session){String userName=(String)session.getAttribute("userName");if (StringUtils.hasLength(userName)){return userName;}return "";}

前端代码：

//登录页面
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js">
</script>
<script>function login() {$.ajax({type: "post",url: "/user/login",data: {"userName": $("#userName").val(),"password": $("#password").val()},success: function (result) {if (result) {location.href = "/index.html"} else {alert("账号或密码有误.");}}});}
</script>

在这里插入图片描述

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js">
</script>
<script>$.ajax({type: "get",url: "/user/getLongin",success: function (result) {$("#loginUser").text(result);}});
</script>

在这里插入图片描述
多次刷新，登陆人依旧存在，但是注意，Session存在内存中,如果不做任何处理,默认服务器重启,Session数据就丢失了。

留言板

输入留言信息，点击提交。
后端把数据存储起来，并且页面展示出留言信息。

后端代码

存储留言信息：
model层

package com.zc.spring.demo.model;import lombok.Data;import java.util.Date;@Data
public class MessageInfo {private String from;private String to;private String message;private Integer deleteFlag;private Date createTime;private Date updateTime;

controller层：

package com.zc.spring.demo.controller;import com.zc.spring.demo.model.MessageInfo;
import com.zc.spring.demo.service.MessageService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.*;import java.util.List;@RequestMapping("/message")
@RestController
public class MessageController {@Autowiredprivate MessageService messageService;@GetMapping(value = "/publish")public String publish(@RequestBody MessageInfo messageInfo){if (!StringUtils.hasLength(messageInfo.getFrom())|| !StringUtils.hasLength(messageInfo.getTo())|| !StringUtils.hasLength(messageInfo.getMessage())) {return "{\"ok\": 0}";}//存储留言messageService.addMessage(messageInfo);
//        messageInfoList.add(messageInfo);return "{\"ok\": 1}";}
//获取留言列表@GetMapping("/getList")public List<MessageInfo> getList(){return messageService.queryAll();}}

service层

package com.zc.spring.demo.service;import com.zc.spring.demo.mapper.MessageMapper;
import com.zc.spring.demo.model.MessageInfo;
import org.apache.ibatis.annotations.Select;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;import java.util.List;@Service
public class MessageService {@Autowiredprivate MessageMapper messageMapper;public void addMessage(MessageInfo messageInfo){messageMapper.insertMessage(messageInfo);}public List<MessageInfo> queryAll(){return  messageMapper.queryAll();}
}

mapper层

package com.zc.spring.demo.mapper;import com.zc.spring.demo.model.MessageInfo;
import org.apache.ibatis.annotations.Insert;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;import java.util.List;@Mapper
public interface MessageMapper {//查询所有留言信息@Select("select * from message_info where delete_flag=0")List<MessageInfo> queryAll();//发表留言@Insert("insert into message_info (`from`, `to`, message) values (#{from}, #{to}, #{message})")Integer insertMessage(MessageInfo messageInfo);
}

前端代码

<!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://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script><script>function submit(){//1. 获取留言的内容var from = $('#from').val();var to = $('#to').val();var say = $('#say').val();if (from== '' || to == '' || say == '') {return;}//2. 构造节点var divE = "<div>"+from +"对" + to + "说:" + say+"</div>";//3. 把节点添加到页面上    $(".container").append(divE);//4. 清空输入框的值$('#from').val("");$('#to').val("");$('#say').val("");}</script>
</body></html

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

完结

点一个免费的赞并收藏起来~
点点关注，避免找不到我~
我的主页：optimistic_chen我们下期不见不散 ~ ~ ~

http://www.dtcms.com/a/358812.html

相关文章：

  • Qt中的QSS介绍
  • JavaScript 中的 this 关键字
  • 机器视觉学习-day11-图像噪点消除
  • VuePress添加自定义组件
  • android studio编译安卓项目报gradle下载失败
  • [光学原理与应用-337]：ZEMAX - 自带的用于学习的样例设计
  • 知识随记-----Qt 样式表深度解析：何时需要重写 paintEvent 让 QSS 生效
  • [算法] 双指针：本质是“分治思维“——从基础原理到实战的深度解析
  • 05.《ARP协议基础知识探秘》
  • 构建AI智能体：十八、解密LangChain中的RAG架构：让AI模型突破局限学会“翻书”答题
  • 银河麒麟V10（Phytium,D2000/8 E8C, aarch64）开发Qt
  • 魔方的使用
  • 进制转换问题
  • 【车载开发系列】CAN与CANFD上篇
  • 前端代码结构详解
  • Python数据处理
  • 6.1 Update不能写复杂的逻辑
  • ReconDreamer
  • 前端浏览器调试
  • Python爬虫实战：构建Widgets 小组件数据采集和分析系统
  • Apple登录接入记录
  • Spring AI 的应用和开发
  • 突发，支付宝发布公告
  • GitHub 热榜项目 - 日榜(2025-08-30)
  • Unity笔记(八)——资源动态加载、场景异步加载
  • DbVisualizer：一款功能强大的通用数据库管理开发工具
  • 自动修改psd_生成套图 自动合并图片 自动生成psd文字层
  • Go 语言面试指南：常见问题及答案解析
  • 【具身智能】【机器人动力学】台大林佩群笔记-待持续更新
  • 索引结构与散列技术：高效数据检索的核心方法