Spring MVC 响应处理:页面、素材与状态配备详解

个人主页♡喜欢做梦

欢迎  点赞  ➕关注  ❤️收藏  评论


目录

响应

定义

返回静态页面

返回数据:@ResponseBody

 @ResponseBody和@RestController的区别

返回JSON

状态码

状态码的定义

设置状态码

设置header

综合性练习

加法计算器

用户登入


响应

定义

响应(Response)是接收方(服务器、服务或设备)针对发送方(客户端)发起的“请求”所返回的反馈信息。

返回静态页面

html代码:




    
    Title


    

我是index页面

代码:

@RestController
@RequestMapping("response")
public class ResponseController {
    @RequestMapping("/1")
    public String method1(){
        return "/index.html";
    }
}

结果:咦?这结果怎么不是我们想要的页面?为什么会这样?那要怎么修改?

这个代码的问题在于@RestController会将返回值直接作为响应体。这里我们需要用到@Controller。

为什么呢?

@Controller:@Controller是承接http请求,完成视图解析,方法返回的字符串会被视图解析器处理,找到对应的页面文件,响应给前端。

@RestController:是@ResponseBody+@Controller的组合注解,核心是直接返回数据,而不是视图,不会做视图解析流程。

那这样就可以了吗

正确代码如下:

@Controller
@RequestMapping("response")
public class ResponseController {
    @RequestMapping("/1")
    public String method1(){
        return "/index.html";
    }
}

返回数据:@ResponseBody

@ResponseBody:他主要用于将方法的返回值直接写入http响应体中,而不是将其解析为视图名称去进行视图跳转。简单来说,就是把你要返回的东西直接原样发给前端,不会当成路径页面瞎找。

    @RequestMapping("/2")
    @ResponseBody
    public String method2(){
        return "返回数据";
    }

如果没有加@ResponseBody,结果如下,有人可能会疑问,那为什么我返回静态页面第一个错误的代码,也可以返回数据。因为第一个错误代码里面使用的是@RestController注解,核心是直接返回数据。

那@ResponseBody和@RestController又有什么区别?

 @ResponseBody和@RestController的区别

对比@RestController@ResponseBody
作用范围只能用在类上只能用在方法上
功能本质相当于@ResponseBody+@Controller的组合,标记一个类,表明该类是一个控制器单独的注解,仅控制方法返回作为响应
使用场景整个类都需要返回数据,一次注解,全类方法生效类用@Controller时,个别方法需要返回数据,逐个方法标记
视图解析不会走视图解析,直接返回数据不会走视图解析,直接返回数据

@RestController就像老师在班群里面通知消息,而@ResponseBody相当于老师个别针对几个同学私信通知消息。

返回HTML片段代码

 @RequestMapping("/4")
    @ResponseBody
    public String method4(){
        return "

我是一级标题

"; }

看一下结果

不是说好的,@ResponseBody是原样返回字符串吗,为什么这次不是!!!

这里解释一下:是因为浏览器会自动解析html,造成一种“不是原样”返回的错觉。

浏览器收到响应后,发现响应头里的Content-type是text/html(Spring自动推断的),就会按照html的规则进行渲染。

如果想让浏览器不解析,直接显示原样,应该怎么写?

这里需要设置Content-type

可以强制让响应方法变为纯文本,给方法加produces=“text/plain”

代码:

 @RequestMapping(value = "/5",produces = "text/plain")
    @ResponseBody
    public String method5(){
        return "

我是一级标题

"; }

结果:

返回JSON

UserInfo

public class UserInfo {
    private String name;
    private int age;
    public UserInfo(){
    }
    public UserInfo(String name, int age) {
        this.name = name;
        this.age = age;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public int getAge() {
        return age;
    }
    public void setAge(int age) {
        this.age = age;
    }
    @Override
    public String toString() {
        return "UserInfo{" +
                "name='" + name + '\'' +
                ", age=" + age +
                '}';
    }
}

返回json对象代码:

 @RequestMapping("/6")
    @ResponseBody
    public UserInfo method6(){
        UserInfo userInfo=new UserInfo("lisi",13);
        return userInfo;
    }

结果:

状态码

状态码的定义

状态码是http协议中,服务器响应请求时返回的三位数数字,用来快速告知客服端“请求处理结果”,就是请求结果的快捷反馈

分类:

  • 1xx:服务器已收到请求,需继续处理(如100Continue让客户端继续发数据)
  • 2xx:请求成功(200 OK表示请求完成,201 Created表示资源创建成功)
  • 3xx:需客户端进一步操作(301永久重定向,302临时重定向)
  • 4xx:客户端请求有误(400请求语法错误、401需登入、403没权限、404资源找不到)
  • 5xx:服务器处理出错(500服务器内部故障、503服务器忙/维护中)

设置状态码

代码:

 @RequestMapping("/7")
    @ResponseBody
    public String method7(HttpServletResponse response){
        response.setStatus(401);
        return "设置状态码成功";
    }

结果:

设置header

代码:

@RequestMapping("/8")
    @ResponseBody
    public String method8(HttpServletResponse response){
        response.setHeader("headerkey","headervalue");
        return "设置header成功";
    }

结果

综合性练习

练习1:

加法计算器

前端代码:




    
    
    Document


     

计算器

数字1:
数字2:

前后端交互接口

服务器代码:

@RestController
@RequestMapping("/calc")
public class CalcController {
    @RequestMapping("/sum")
    public String method8(Integer num1,Integer num2){
        //如果有其中一个没有参数,直接返回
        if(num1 == null || num2 ==null){
            return "参数不合法";
        }
        Integer sum=num1+num2;
        return "

计算机结果:" + sum + "

"; } }

练习2:

用户登入

我们需要一个前端的输入信息登入界面,然后向后端发送请求进行校验,查询当前账号是否正确。随后在有一个登入状态,展示当前登入的用户名。

1.前端登入页

功能:提供输入框页面,以及通过点击按钮像后端发送请求,进行前后端的交互




  
  登录页面



  

用户登录

用户名:
密码:
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.7.1.min.js"></script> <script> function login(){ //获取前端数据发送给后端,到时候后端进行校验 //1.请求方式 //2.后端地址 //3.前端数据 //使用jQuery的ajax方法发送请求 $.ajax({ //请求类型 type: "post", //请求后端接口地址 url: "/user/login", //要发送到后端的数据 data: { //获取输入框的值 userName: $("#userName").val(), password: $("#password").val() }, //返回后端校验后的结果 //成功跳转页面 //失败,进行错误提示 //http请求成功的回调函数 //success:是ajax专门为成功响应设计的回调,会自动接收后端返回的正常结果 success: function(result){ //判断后端返回的结果 if(result){ //如果登入成功,跳转页面 location.href="index2.html"; }else{ //否则,返回错误提示 alert("密码错误"); } } }) } </script>

2.后端控制器

功能:提供两个接口,进行接口的校验,查询当前的登入状态。

import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
@RequestMapping("/user")
@RestController
public class UserController {
       @RequestMapping("/login")
       //校验,记录登入状态
    public Boolean login(String userName, String password, HttpSession session){
           //参数校验:校验用户名和密码是否为空或者不是空字符串
           //写法一:
//           if(userName == null || userName == "" || password == null || password == "" ){
//                 return false;
//           }
           //写法二:
           //StringUtils.hasLength():校验用户名和密码是否为空或者不是空字符串
           if(!StringUtils.hasLength(userName)  || !StringUtils.hasLength(password)){
               return false;
           }
           //校验用户名和密码是否正确
           //这里是硬编码,固定用户名为admin和密码为123456,实际数据要从数据库中查询验证
           if("admin".equals(userName) &&  "123456".equals(password)){
               //如果校验成功,将用户名存储到会话中
               session.setAttribute("userName",userName);
               return true;
           }
           return false;
       }
       //查询当前登入状态
       @RequestMapping("/getLoginUser")
    public String getLoginUser(HttpSession session){
           //获取会话中存储的值
           //如果用户未登入,返回null
           //如果用户已登入,返回用户名
           String userName=(String) session.getAttribute("userName");
           return userName;
       }
}

前端首页

功能:查询登入状态,展示用户的登入名




    
    
    
    用户登录首页


    登录人: 
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.7.1.min.js"></script>
    <script>
        $.ajax({
            url: "/user/getLoginUser",
            type: "get",
            //请求成功后的回调函数
            success: function(userName){
                //将结果填充到页面
                $("#loginUser").text(userName);
            }
        });
    </script>

posted @ 2025-12-01 14:47  yangykaifa  阅读(5)  评论(0)    收藏  举报