关于后端数据接收(vue3+axios+springboot)

Question

关于后端数据接收(vue3+axios+springboot)

在我使用request发起请求的时候，我发现一直都有400错误，搜索发现是这个传参不对。

我这个项目中数据的提交方式在request.js中设置为了application/json，而且后台其他的controller接收前端json格式的参数都没问题，唯独这个有问题。

这是我在前端vue中script下的函数

javascript
const handleLogin = () => {
  request.post('/signIn',{tel:"1111111"})
  }

这是我在controller里面的函数

@PostMapping("/signIn")
public Result signIn(@RequestParam String tel){
{
    return Result.success(1);
}

这里的话请忽略他的业务功能，因为为了好排错就注释了很多。

然后我在postman中发起请求，我发现json提交不行，需要使用form-data

关键是我并不清楚为什么其他的后端可以接收json提交来的数据，但是这个却必须要form-data[

Answer 1

让【道友老李】来帮你解答，本回答参考gpt编写，并整理提供，如果还有疑问可以点击头像关注私信或评论。

如果答案让您满意，请采纳、关注，非常感谢！

在前端代码中，你使用了axios的post方法发送请求，并且将数据以JSON格式传递给后端。而在后端的controller中，你使用了@RequestParam注解来接收前端传递的数据，这样只能接收form-data格式的数据，无法接收JSON格式的数据。 要解决这个问题，你可以修改前端代码，将数据以form-data格式传递给后端。可以使用FormData对象来创建form-data格式的数据，并将数据以键值对的形式添加到FormData对象中，然后发送请求时传递FormData对象。 下面是修改后的前端代码示例：

const handleLogin = () => {
  const formData = new FormData();
  formData.append('tel', '1111111');
  request.post('/signIn', formData)
}

这样修改之后，前端将以form-data格式向后端发送数据，后端的controller就可以正确接收到数据了。