SpringMVC 接收前端参数

SpringMVC 接收前端参数

1. 接收字符串

JavaScript代码

$.ajax({
            url: "http://localhost:8080/test",
            method: "POST",
            data: {
                name: "钟力"
            },
            success: function (result) {
                console.log(result);
            },
        })

Java代码

@ResponseBody
@RequestMapping(value = "test")
public String test(@RequestParam("name") String name) {
    // 打印接收到的参数
	System.out.println(name);
	// 将接收到的参数返回给前端
	return name;
}

2. 接收数组

JavaScript代码

 $.ajax({
            url: "http://localhost:8080/test",
            method: "POST",
            data: {
                profession: ["前端开发工程师", "Java高级工程师"],
            },
            success: function (result) {
                console.log(result);
            },
        })

Java代码

public List<Object> test(@RequestParam(value = "profession[]") List<Object> list) {
	// 打印接收到的参数
	System.out.println(list);
	// 将接收到的参数返回给前端
	return list;
}

3. 接收 JSON 对象转为 Map 对象

JavaScript 代码

let data = {
            // 字符串
            name: "钟力",
            // 数组
            profession: ["前端开发工程师", "Java高级工程师"],
            // 对象
            experience: {
                html: {
                    name: "前端开发工程师",
                    startTime: "1970-01-01",
                    endTime: "1970-12-31"
                },
                java: {
                    name: "Java高级工程师",
                    startTime: "1971-01-01",
                    endTime: "1971-12-31"
                }

            }
        }

$.ajax({
            url: "http://localhost:8080/test",
            // 请求类型需要为POST
            method: "POST",
            // 需要将JSON对象转为JSON字符串
            data: JSON.stringify(data),
            // 内存类型需要更改为 'application/json;charset=utf-8'
            contentType: 'application/json;charset=utf-8',
            success: function (result) {
                console.log(result);
            },
        })

Java代码

@ResponseBody
@RequestMapping(value = "test")
public Map<String, Object> test(@RequestBody Map<String, Object> map) {
	// 打印接收到的参数
	System.out.println(map);
	// 将接收到的参数返回给前端
	return map;;
}

4. 接收 JSON 数组对象转为 List 对象

JavaScript代码

let data = [
            // 字符串
            "钟力",
            // 数组
            ["前端开发工程师", "Java高级工程师"],
            // 对象
            {
                html: {
                    name: "前端开发工程师",
                    startTime: "1970-01-01",
                    endTime: "1970-12-31"
                },
                java: {
                    name: "Java高级工程师",
                    startTime: "1971-01-01",
                    endTime: "1971-12-31"
                }
            }
        ]

$.ajax({
            url: "http://localhost:8080/test",
            // 请求类型需要为POST
            method: "POST",
            // 需要将JSON对象转为JSON字符串
            data: JSON.stringify(data),
            // 内存类型需要更改为 'application/json;charset=utf-8'
            contentType: 'application/json;charset=utf-8',
            success: function (result) {
                console.log(result);
            },
        })

Java代码

@ResponseBody
@RequestMapping(value = "test")
public List<Object> test(@RequestBody List<Object> list) {
	// 打印接收到的参数
	System.out.println(list);
	// 将接收到的参数返回给前端
	return list;
}