SpringMVC 定义

MVC定义

创建SpringMVC项目

SpringMVC掌握功能

一、连接功能

@RequestMapping(请求映射)

@GetMapping 和 @PostMapping

二、获取参数功能

传递单个参数/多个参数

注意点：

@RequestParam(前后端参数映射)

前后端参数映射

@RequestParam特性：设置参数必传

@RequestParam特性：设置参数为非必传

传递对象

@RequestBody 接收JSON对象

获取URL中参数@PathVariable

上传文件@RequestPart

获取Cookie/Session/header

@CookieValue

@RequestHeader

@SessionAttribute

三、返回数据功能

返回静态页面

请求重定向和请求转发

请求重定向与请求转发区别

请求转发

请求重定向

前后端交互

使用form表单传递参数

使用ajax传递参数给后端

SpringMVC 定义

SpringMVC是一个Web框架，基于Servlet的API构建的。

MVC定义

MVC是Model、View和Controller的缩写，分别代表着模型、视图和控制器。

Controller（控制器）是应⽤程序中处理⽤户交互的部分。通常控制器负责从视图读取数据，

控制⽤户输⼊，并向模型发送数据。

Model（模型）是应⽤程序中⽤于处理应⽤程序数据逻辑的部分。通常模型对象负责在数据库存取数据
View（视图）是应⽤程序中处理数据显示的部分。通常视图是依据模型数据创建的

创建SpringMVC项目

SpringMVC 项目是基于SpringBoot项目创建的基础创建的

创建SpringBoot项目时候勾选SpringWeb即可创建SpringMVC项目。

SpringMVC掌握功能

1、连接功能：用户（浏览器端）与项目程序建立连接，即输入一个URL能够访问到我们的程序代码结果

2、获取参数功能：后台程序能够获取到用户输入的参数（前端传递）

3、输出数据功能：后台程序接收到用户访问所输入的数据，经过业务逻辑的处理后，需要将处理的数据结果传递给前端，返回给用户。

一、连接功能

连接功能需要建立路由映射，实现用户与程序之间的连接，这里就需要使用到注解有@RequestMapping(请求映射)

@RequestMapping(请求映射)

此注解可以实现路由映射，通过输入一个URL来访问我们的项目程序。

@RequestMapping 的最小请求单元是方法。

因此使用该注解必须要添加在方法上。同时该注解也可以加在类上即一级目录，加在方法上为二级目录（也可以直接修饰方法）。

通常用户在获取我们程序结果的时候，还需要搭配2个注解来配合@RequestMapping来使用，这两个注解就是:

@ResponseBody (告诉程序返回的是数据而不是前端页面)

@Controller (让框架启动的时候加载当前类，只有加载的类才能被用户访问到)

这两个注解也可以使用一个组合注解@RestController来代替

  @RestController = @ResponseBody + @Controller

示例代码如下：

@RequestMapping("/hello") // 一级路由目录
@Controller // 让框架启动的时候加载当前类
@ResponseBody //告诉程序返回的是数据而非页面
public class UrlSpringMVC {

    @RequestMapping("/hi") // 二级路由目录
    public String func(){
        return "你好，SpringMVC";
    }
}

@GetMapping 和 @PostMapping

@RequestMapping注解既可以支持Get请求，也支持Post请求，默认情况下仅支持Get请求

如果需要指定只支持Get请求或者只支持Post请求，可以修改@RequestMapping中的方法进行定义仅支持Get请求或者仅支持Post请求。

修改方法如下：

@RequestMapping(value ="/hi" ,method = RequestMethod.GET) 
@RequestMapping(value = "/he",method = RequestMethod.POST)

方式二：可以直接使用@GetMapping 或者@PostMapping

注意点：@GetMapping 和@PostMapping 需要直接加载在方法上

@GetMapping("/hi")

@PostMapping("/hi")

二、获取参数功能

传递单个参数/多个参数

用户从前端返回参数给后端，后端接收用户输入的数据进行处理

@RequestMapping("/hello") // 一级路由目录
@Controller // 让框架加载的时候启动当前类
@ResponseBody //告诉程序返回的是数据而非页面

public class UrlSpringMVC {

    @GetMapping("/hi")
    public String func(String name,String password){
        return "名字：" + name + "  密码："+ password;
    }
}

注意点：

1）后端接收参数是按照参数名称进行匹配的，与参数顺序没有关系

示例如下：

2）后端在接收前端返回参数时，需要用包装类进行接收，防止前端没有传参数导致后端没有接收到参数而发生程序异常

(重要的事情说三遍：使用包装类传递参数、使用包装类传递参数、使用包装类传递参数)

示例代码如下：

@RequestMapping("/hello") // 一级路由目录
@Controller // 让框架加载的时候启动当前类
@ResponseBody //告诉程序返回的是数据而非页面

public class UrlSpringMVC {

    @GetMapping("/hi")
    public String func(int  number){

        return  "前端传入参数："+number;
    }
}

情况一：当前端正常返回参数，后端使用基本数据类型接收传递的参数

情况二：当前端没有传入参数时，后端使用基本数据类型来接收传递参数，此时导致后端没有收到参数而发生程序异常

解决方法：后端接收参数使用包装类来接收参数，防止前端没有传入参数，

当前端没有传入参数时，后端可以输出结果为null，程序就不会发生异常了

修正代码运行：

@GetMapping("/hi")
    public String func(Integer  number){  //使用包装类来接收传入参数
       return  "前端传入参数："+number;
    }

@RequestParam(前后端参数映射)

前后端参数映射

有时候前段传递的参数key值与后端接收参数的key值不一样，就比如说前端传入两个数字key值使用的是number1、number2，而后端接收数字的key值是number3和number4，此时就会发生参数无法接收不到的情况了。

此时就需要使用注解@RequestParam来进行前后端参数映射

 @RequestMapping("/m1")

    //前端传入参数key值是number1、number2，后端接收参数key值是number3和number4
    //使用@RequestParam 将number1映射成number3,将number2映射成number4

     public String test(@RequestParam("number1") Integer number3,
                       @RequestParam("number2") Integer number4){

          return "后端接收参数number3为："+ number3 +", number4:"+ number4;

    }

    }

@RequestParam特性：设置参数必传

查看源码可知@RequestParam默认设置参数为必传，如果前端没有传递参数时就会发生程序异常

@RequestParam特性：设置参数为非必传

在项目中我们传递的参数为非必要传递参数，此时就需要对@RequestParam 属性进行修改，将required修改为false即可设置为参数为非必传

  @RequestMapping("/m1")
    public String test(@RequestParam(value="number1",required = false) Integer number3,
                   @RequestParam(value = "number2",required = false) Integer number4){

        return "后端接收参数number3为："+ number3 +", number4:"+ number4;

    }

传递对象

定义对象代码

import lombok.Data;

@Data
public class Student {
    private int id;
    private String name;
    private String password;
}

后端返回参数代码

  @RequestMapping("/n1")
    public String people(Student student){
        return "id号："+ student.getId()+" 姓名："
            + student.getName()+" 密码："+ student.getPassword();
    }

@RequestBody 接收JSON对象

@RequestBody可以用来接收前端传来的JSON对象，用法与传递对象类似，示例如下：

注意：@RequestBody 必须要求是post映射

@Data
public class Student {
    private int id;
    private String name;
    private String password;
}

  @PostMapping("/n11")  //@RequestBody 必须要求是post映射
    public String method(@RequestBody Student student){
        return student.toString();
    }

获取URL中参数@PathVariable

使用@PathVariable可以更加简洁的从URL获取参数

 @RequestMapping("/n2/{username}/{password}")
    public String people1(@PathVariable String username,@PathVariable String password){
        return username + " : "+ password ;
    }

其中{username}{password}为必须传递的参数，否则访问出现404

上传文件@RequestPart

 @RequestMapping("/upFile")
    public String myupFile(@RequestPart("file")MultipartFile file) throws IOException {
        //根目录
        String path = "F:\\upFile\\";
        //根目录 + [唯一的文件名]
        path += UUID.randomUUID().toString().replace("-","");
        // 根目录 + [唯一的文件名] + 【文件的后缀】 ex:.png
        path += file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf("."));
        file.transferTo(new File(path));
        return path;
    }

获取Cookie/Session/header

@CookieValue

获取cookie就需要使用到此注解@CookieValue

@RequestMapping("/cookie")
    public String getMyCookie(@CookieValue("cookies") String getCookie){
        return "Cookie :" + getCookie;
    }

@RequestHeader

获取Header信息使用该注解

 @RequestMapping("header")
    public String getHead(@RequestHeader("User-Agent") String userAgent) {
        return "User-Agent；"+userAgent;
    }

@SessionAttribute

存储Session

@RequestMapping("/cunSession")
    public String setsess(HttpServletRequest request) {
      // 获取 HttpSession 对象，参数设置为 true 表示如果没有 session 对象就创建⼀个 session

        HttpSession session = request.getSession(true);
        if(session!=null){
            session.setAttribute("username","SpringMVC"); //SpringMVC为创建的Session
        }
        return "session 存储成功";
    }

获取session 简洁方式，直接使用@SessionAttribute

   @RequestMapping("/Session")
    public String getSession(@SessionAttribute(value = "username" ,required = false) 
                                String userSession){
                        return "获取Session:" + userSession;
    }

三、返回数据功能

返回静态页面

在第一个功能：连接功能已经关于@ResponseBody说明该注解的功能：告诉程序返回的是数据而不是前端页面

使用@ResponseBody返回的是一个数据而非前端页面，如果不使用该注解，则返回的是一个前端页面

创建test.html前端文件：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    这是前端页面HTML !!!
</body>
</html>

使用@ResponseBody效果：

@RequestMapping("/yemian")
    @ResponseBody //告诉程序返回的是数据而非页面
    public String func(){
        return "test.html";
    }

不使用@ResponseBody效果：

@RequestMapping("/yemian")

    public String func(){
        return "test.html";
    }

请求重定向和请求转发

请求重定向：forward

请求转发：redirect

“转发”和“重定向”理解：在中国官方发布的内容越少事也越大， “转发”和“重定向”也是⼀样：字越少，责任越大。转发是服务器帮转的，而重定向是让浏览器重新请求另⼀个地址。

请求重定向与请求转发区别

1、请求转发：请求转发是客户端向服务器发送请求，服务器来转发这个请求，执行对象是服务器

2、请求重定向：请求重定向是客户端向服务器发送请求，服务器告诉客户端一个新的资源地址，客户端再去完成，执行对象是客户端

3、请求重定向与直接访问新地址效果⼀样，不存在原来的外部资源不能访问；请求转发服务器端转发有可能造成原外部资源不能访问。

请求转发

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

请求转发是客户端让服务器转发地址，地址不发生变化

请求重定向

  @RequestMapping("/fo")
    public String func2(){
        return "forward:test.html";
    }

请求重定向是客户端重新发送新的地址，地址发生了变化

前后端交互

使用form表单传递参数

示例：实现计算器功能

前端代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>计算器</title>
</head>
<body>
    <form action="http://localhost:8080/hello/jishuang">
        <h1>计算器</h1>
        数字1：&nbsp;&nbsp;<input name="num1" type="text"><br>
        数字2：&nbsp;&nbsp;<input name="num2" type="text"><br>
        <input type="submit" value=" 点击相加 ">
        </form>
    
</body>
</html>

后端代码：

 @RequestMapping("/jishuang")
  @RestController
    public String func(Integer num1,Integer num2){

            if(num1 == null || num2 == null){
                   return "数据不可为空，请重新输入<a href='javascript:history.go(-1);'>返回</a>";
            }else{

                 return "<h2>计算结果为："+(num1+num2)+"</h2><a href='javascript:history.go(-1);'>返回</a>";
            }
    }