springcloud发布resful，前端用axios请求后台

最新推荐文章于 2025-01-02 15:19:15 发布

tinalucky

最新推荐文章于 2025-01-02 15:19:15 发布

阅读量277

点赞数

CC 4.0 BY-SA版权

分类专栏： java js 文章标签： springcloud resful axios

本文链接：https://blog.csdn.net/tinalucky/article/details/104142151

js 同时被 2 个专栏收录

5 篇文章

订阅专栏

java

2 篇文章

订阅专栏

本文探讨了SpringCloud RESTful API与前端Axios请求之间的Content-Type不匹配问题，详细解释了不同Content-Type（如application/json与application/x-www-form-urlencoded）在前后端交互中的作用，并提供了调整Axios配置及后端参数接收方式的解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

springcloud发布resful，前端用axios请求后台，发现后台的参数获取都是null。开始以为是哪里写错了，折腾了很久。后来上网搜到了解决方案，根源在于前端用axios发送请求时Content-Type默认是application/json;charset=UTF-8。而后台用的Content-Type是'Content-Type': 'application/x-www-form-urlencoded'。两者不一致导致。

下面是axios的post请求常见的数据格式（content-type）

Content-Type: application/json ：请求体中的数据会以json字符串的形式发送到后端
Content-Type: application/x-www-form-urlencoded：请求体中的数据会以普通表单形式（键值对）发送到后端
Content-Type: multipart/form-data：它会将请求体的数据处理为一条消息，以标签为单元，用分隔符分开。既可以上传键值对，也可以上传文件

知道原因后，所以有几种解决方案：

一种是修改axios的内容类型，如下:

全局方式：axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

请求时指定方式：

axios({ headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, method: 'post', url: '/api/lockServer/search', data: {xxx: 'xxx'} })

另一种是后台使用Map<String,Object> params参数来接收：

GET请求时可以用@RequestParam Map<String,Object> params，也可以用@RequestBody Map<String, Object> params;POST请求只能用@RequestBody Map<String, Object> params。