解决 Content type ‘application/json；charset=UTF-8‘ not supported
https://img-blog.csdnimg.cn/direct/1fa995c384134bb2909bd763059cf3de.jpeg#pic_center问题形貌
我项如今端采用vue-elementUi-admin框架进行开发，后端利用SpringBoot，但在前后端登录接口交互时，前端报了如下错误
https://img-blog.csdnimg.cn/direct/c9f3d018d19b4c0180699a1ed7d2131d.png完整报错信息如下
https://img-blog.csdnimg.cn/direct/2d9ee62a31234414bd66b4c37894bf6e.png
前端登录接口JS代码如下
export function login(data) {
return request({
url: '/users/login',
method: 'post',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
},
data
})
}
后端登录接口相应代码如下
@PostMapping("/login")
public HttpResult login(@RequestBody UsersDto usersDto) {
System.out.println("usersDto = " + usersDto);
Map<String, String> map = new HashMap<>();
map.put("token", "admin-token");
return HttpResult.ok(map);
}
https://img-blog.csdnimg.cn/direct/6ce071f942c34435ac10dcb6ca92ef52.png
https://img-blog.csdnimg.cn/direct/6fe51e60048843879c0c701e14a301d3.png
原因分析
众所周知，@RequestBody紧张用来 接收前端通报给后端的json字符串中的数据的(请求体中的数据的)，然后Spring Mvc就会将该数据装配到目标类(@RequestBody后面的类)中；而GET方式无请求体，所以利用@RequestBody接收数据时，前端不能利用GET方式提交数据，而是用POST方式进行提交。
但是，请注意“装配”的过程中会根据json字符串中的key来匹配对应实体类的属性，如果匹配同等且json中的该key对应的值的范例符合（或可转换为“”或null）
Trips
[*]前端json字符串中，如果value为"“的话，后端实体类对应的属性如果是String范例时，那么接受到的就是”"
[*]如果是后端实体类的属性范例是Integer、Double等范例，那么后端接收到的就是null
[*]json字符串中，如果value为null的话，后端实体类对应属性接收的就是null
基于上述分析，排查前端携带的参数与后端的接收类时后发现，报错的原因是 前端传过来的json字符串中的key与后端的接受类（利用@RequestBody修饰的类）属性名不同等，无法将key映射到实体类的属性中
前端登录接口携带参数如下
https://img-blog.csdnimg.cn/direct/b12d5fffa6d44ab6a7cfc76625b0ec97.png
后端目标类的属性如下
https://img-blog.csdnimg.cn/direct/d500e6e8ad944c599f9c776ea22d3212.png
解决方案
将后端目标类的属性名和前端json字符串对应的key保持同等
https://img-blog.csdnimg.cn/direct/69549bc9e23e4ec58310cfe2c26a1ff3.png
参考资料
[*]@RequestBody的详解和利用
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]