1、使用的相关技术

1.web后端使用springboot               
2.前端使用vue+axios
3.使用apifox进行测试

2、使用apifox对前后端传输的数据进行模拟

情况一、apifox使用get请求向后端发送数据

模拟的场景一如下

apifox中数据的填写如下：

后端的代码如下：

@GetMapping("/SetStudent")
    public String setStudent(
            @RequestParam("name") String name,//接受的参数使用@RequestParam注解标识
            @RequestParam("age") int age,
            @RequestParam("school") String school
    ){
        System.out.println("姓名："+name+",年龄："+age+",学校："+school);
        return "设置成功";
    }

实例的结果如下：

后端代码也可以如下所示：

@GetMapping("/SetStudent1")
    public String setStudent1(
            StudentBoc studentBoc //这是一个对象
    ){

        System.out.println("姓名："+studentBoc.getName()+",年龄："+studentBoc.getAge()+",学校："+studentBoc.getSchool());
        return "设置成功";
    }

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;

@Data
@NoArgsConstructor
@AllArgsConstructor
public class StudentBoc {
    private String name;
    private int age;
    private String school;
}

实验的结果如上图一致。

模拟场景二如下

我们可以在请求路径后面接上{}来传递参数，其后端代码如下：

@GetMapping(value = "/getStudent/{id}/{name}/{school}")  //例如请求路径http://localhost:8000/getStudent/1/李四/剑桥大学
    public Object exec(
            @PathVariable("id") String id,  //后端使用@PathVariable注解来接受数据
            @PathVariable("name") String name,
            @PathVariable("school") String school
    ){
        System.out.println("id = "+id+"name = "+name+"school = "+school);
        return 1;
    }

apifox的请求：

情况二、apifox使用Post请求向后端发送数据

1、使用json格式传输数据

前后端使用Post请求传送一个对象

@PostMapping("/PostSetStudent")
    public String PostSetStudent(
            @RequestBody StudentBoc studentBoc   //后端使用@RequestBody注解获取对象
    ){

        System.out.println("姓名："+studentBoc.getName()+",年龄："+studentBoc.getAge()+",学校："+studentBoc.getSchool());
        return "设置成功";
    }

前后端使用Post请求传送一个List集合

@PostMapping("/PostSetStudent1")
    public String PostSetStudent1(
            @RequestBody List<StudentBoc> list
    ){

        list.forEach((stu)-> System.out.println("姓名："+stu.getName()+",年龄："+stu.getAge()+",学校："+stu.getSchool()));
        return "设置成功";
    }

前后端使用Map集合来传递数据

@PostMapping("/getMap")
    public String getMap(
            @RequestBody Map<String,Object> map
    ){
        map.forEach((key,value)->{
            System.out.println(key+":"+value);
        });

        return "true";
    }

2、使用-www-form-urlencoded格式传输数据

@PostMapping("/PostSetStudent2")
    public String PostSetStudent2(
            String name,
            int age,
            String school
    ){
        System.out.println("姓名："+name+",年龄："+age+",学校："+school);
        return "设置成功";
    }

3、使用form-data格式传输数据

1.使用form-data传输数据

@PostMapping("/PostSetStudent3")
    public String PostSetStudent3(
            String name,
            int age,
            String school
    ){
        System.out.println("姓名："+name+",年龄："+age+",学校："+school);
        return "设置成功";
    }

2、使用form-data传输文件

后端的书写：

导入需要依赖的jar包

<dependency>
            <groupId>commons-fileupload</groupId>
            <artifactId>commons-fileupload</artifactId>
            <version>1.4</version>
</dependency>

@PostMapping("/LoadFile")
    public String LoadFile(
            @RequestParam("file") MultipartFile file  //后端使用MultipartFile接受文件类型
    ){
        String tr1= null;//获取文件的路径
        try {
            tr1 = ResourceUtils.getURL("load").getPath();  //获取项目中的load文件夹的相对路径
            file.transferTo(new File(tr1+file.getOriginalFilename()));  //将文件复制到改路径下，
        } catch (Exception e) {
            e.printStackTrace();
        }
        return "传输成功";
    }

3、总结

一、前端使用form-data和x-www-form-urlencoded传输数据时，后端接受键值对参数，注意情况如下：
1. 可以不使用@RequestParam()来指定对应的键是什么，但参数名必须与前端传入的参数名一致。
2. 同样可以使用@RequestParam()来指定键的名称。
3. 可以使用一个定义好的对象，对象的属性名与前端设置的参数名一致，来接受前端的数据。
4. form-data支持文件类型传输，而x-www-form-urlencoded不支持。
二、前端使用json来传输数据时，注意情况如下：
5. 后端必须在参数后面加上@RequestBody来接受参数。
6. 后端接受请求方法中的参数可以是对象、List集合、Map字典等。
三、put、delete等不同类型的请求，前端同样选择这些类型往后端传递参数。

如果各位大神还有其他的补充，欢迎在评论区留言.😊😊😊😊😊😊