Spring MVC下篇

最新推荐文章于 2024-07-20 20:04:43 发布

栋zzzz

最新推荐文章于 2024-07-20 20:04:43 发布

阅读量893

点赞数 36

分类专栏： Spring 文章标签： SpringMVC 静态页面 JSON 请求转发请求重定向

本文链接：https://blog.csdn.net/qq_58266033/article/details/126084284

版权

Spring 专栏收录该内容

9 篇文章 1 订阅

订阅专栏

书接上回Spring MVC上篇,前面介绍了Spring MVC的服务器如何获得用户的请求,那么今天就来介绍一下服务器如何将响应返回给客户端!

在这里插入图片描述

🍓 3.服务器将结果返回给用户（前端）

🍉 3.1.返回一个静态页面

先创建一个静态页面test.html:
在这里插入图片描述

<body>
    <h1>Hello,Test</h1>
</body>

写服务器端的代码:

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class TestController {

    @RequestMapping("/hello")
    public String func(){
        return "/test.html";
    }
}

此时由于没有加@ResponseBody注解,因此就会先从静态页面里面去找有没有这个页面存在,发现有就会直接返回这个静态页面了!

在这里插入图片描述

响应里面正是这个页面!

🍉 3.2.返回 text/html

如果加上@ResponseBody就会直接返回字符串,而不是页面里面的内容了

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RequestMapping;
@ResponseBody
@Controller
public class TestController {

    @RequestMapping("/hello")
    public String func(){
        return "/test.html";
    }
}

在这里插入图片描述

🍉 3.3.返回JSON对象

这里实现一个登录功能,前端使用ajax来发送请求,后端返回json给前端
先来写一个前端页面:


<!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">
    <script src="js/jquery.min.js"></script>
    <title>Document</title>
    <script>
        // ajax 提交
        function mysub(){
            // 1.判空
            var username = jQuery("#username").val();
            var password = jQuery("#password").val();
            if(jQuery.trim(username)==""){
                alert("请先输入用户名！");
                username.focus(); // 光标重制到此元素
                return;
            }
            if(jQuery.trim(password)==""){
                alert("请先输入密码！");
                password.focus(); // 光标重制到此元素
                return;
            }
            jQuery.ajax({
                url:"/login",
                type:"POST",
                contentType:"application/json",
                data:JSON.stringify({"username":username,
            "password":password}),
                success:function(result){
                    alert(JSON.stringify(result));
                }
            });
        }
    </script>
</head>
<body>
<div style="text-align: center;">
    <h1>登录</h1>
    用户：<input id="username">
    <br>
    密码：<input id="password" type="password">
    <br>
    <input type="button" value=" 提交 " onclick="mysub()" style="margin-top: 20px;margin-left: 50px;">
</div>
</body>
</html>


import com.example.demo.model.User;
import org.springframework.stereotype.Controller;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.*;

import java.util.HashMap;

@ResponseBody
@Controller
public class TestController {

    @RequestMapping("/login")
    public HashMap<String, Object> login3(@RequestBody User userInfo) {
        HashMap<String, Object> result = new HashMap<String, Object>();
        int state = 200;
        int data = 0; // 等于 1，登录成功，否则登录失败
        String msg = "未知错误";
        if (StringUtils.hasLength(userInfo.getUsername()) && StringUtils.hasLength(userInfo.getPassword())) {
            if (userInfo.getUsername().equals("zhangsan") && userInfo.getPassword().equals("123")) {
                data = 1;
                msg = "";
            } else {
                msg = "用户名或密码失败！";
            }
        } else { // 参数为空
            msg = "非法参数";
        }
        result.put("state", state);
        result.put("data", data);
        result.put("msg", msg);
        return result;
    }
}

再访问这个页面:
在这里插入图片描述

在这里插入图片描述
这里后端是需要使用@RequestBody来进行接收参数的

🍉 3.4.请求转发或请求重定向

在Java中实现页面跳转就是这两种方式:litchi:

🍫 请求转发:

两种方式:

直接返回一个静态页面

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
@Controller
public class TestController {
    @RequestMapping("fw")
    public String myForward(){
        return "forward:/test.html";
    }
}

在这里插入图片描述
请求转发其实是服务器端的行为(这里forward也是可以省略的)!
2. 使用request对象来进行跳转

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;


//@ResponseBody
@Controller
public class TestController {
    @RequestMapping("fw1")
    public void myForward1(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.getRequestDispatcher("/test.html").forward(request,response);
    }

在这里插入图片描述

🍫 请求重定向

访问静态页面

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
@Controller
public class TestController {

    @RequestMapping("/rd")
    public String myRedirect(){
        return "redirect:/test.html";
    }

在这里插入图片描述

发现这里的请求是有两个的,直接访问rd,就是一个302的临时重定向,然后页面就会跳转到test页面了!
2. 使用response对象来进行跳转

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;


//@ResponseBody
@Controller
public class TestController {
    @RequestMapping("rd1")
    public void myRedirect1(HttpServletResponse response) throws IOException {
        response.sendRedirect("test.html");
    }
}

在这里插入图片描述
也是同样的效果!

🍫 请求转发和请求重定向的区别

定义不同:请求转发是发生在服务端程序内部的,而请求重定向指的是服务器端接收到客户端的请求之后，会给客户端返回了一个临时响应头然后进行跳转的;
跳转方不同:请求转发是服务器端的行为,而请求重定向是客户端的行为;
数据共享不同:请求转发在整个的交互过程中是共享同一个 Request 请求对象和一个 Response 响应对象,而请求重定向客户端发送两次完全不同的请求，所以两次请求中的数据是不同的;
最终 URL 地址不同:请求转发过程中地址是一直不变的,而请求重定向地址是会发生改变的;
代码实现不同:通过上述的代码也是可以看出来代码确实是有差异的!

在这里插入图片描述