问题

目前项目采用的是Vue+SpringCloud,因此请求接口采用的是Axios
首先,我们用F12来分析一下接口请求,因为目前后端并未做请求头的限制,所以初步分析问题的出现应该是受以下结构影响
请求结构

//前端接口请求的请求方式与关键请求头
......
Request Method: PUT
Content-Type: application/json;charset=UTF-8
......
//前端接口请求参数
{id:2,username:"admin"}

后端接口请求接收

/*
 	第一种接收方式(因为无法获取到相关参数,直接报错,也就是:
 	Required XXX parameter 'XXX' is not present)
 */
@PutMapping
public Result test(@RequestParam("id") Long id,@RequestParam("username") String username){
	//业务操作
	......
}
/*
 	第二种接收方式(虽然不会报错,但得到的参数为null)
 */
@PutMapping
public Result test(Long id,String username){
	//业务操作
	......
}
/*
 	第三种接收方式(一切正常)
 */
@PutMapping
public Result test(@RequestBody User user){
	//业务操作
	......
}
/*
 	第四种接收方式(如果去掉@RequestBody,虽然不会报错,但得到的参数为null)
 */
@PutMapping
public Result test(User user){
	//业务操作
	......
}

User.java

public class User{

	private Long id;
	
	private String username;
	......
}

问题解决

以上存在的问题,是因为请求无法传递json格式数据,因此需要将json格式数据转换为字符串或者用,FormData的方式进行传递,经过测试不同解决方案适用不同的请求接收方式,比如:

//出现问题的传参方式
const params = {id: 2,username: "admin"};

//第一种方式(该解决方案仅适用第三种请求方式)
const params = JSON.stringify({id: 2,username: "admin"});

//第二种方式(该解决方案适用以上四种请求方式)
const formData = new FormData();
formData.append("id",2)
formData.append("username","admin")

尾言

如果该文章对你有所帮助,希望大家能够点个免费的赞,这样能够让更多有需要的人看到,如果大家有自己独到的见解,欢迎在评论区留言

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐