客户端表单提交及接收后台json格式数据content-type问题


org.springframework.web.HttpMediaTypeNotSupportedException: Content type ‘application/json;charset=UTF-8’ not supported或其他Content type不支持处理


记录在ssm项目遇到的报错信息,以积累经验


报错原因:

​ form表单的post编码是content-type:application/x-www-form-urlencoded,

​ 我觉得吧,一直报错不支持json格式就是因为后台返回的数据跟客户端的请求头content-type格式不一致导致的,因为原本是用form标签,一直改不了它接收json的格式,而我们需要接收的是json格式的数据,就需要‘application/json’格式的content-type,所有就一直报415的错。

解决方法:

​ 后来我换条思路,干脆不要form标签了,直接用div标签做成跟原本一样的,button按钮提交,结合ajax这样,后来浏览器里的content-type不再是application/x-www-form-urlencoded,json格式的数据也成功接收到,因此问题就解决了。

源码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>登录</title>
<link rel="stylesheet" href="./bootstrap-3.4.1-dist/css/bootstrap.min.css">
<script src="./js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script>
<style>
.w {
width: 300px;
margin: auto;
margin-top: 50px;
}
</style>
</head>
<body>
<div class="container w">
<!-- <form action="http://localhost:8081/app/login" method="post"> -->
<div class="form-group">
用户名:<input type="text" class="form-control" id="userName" name="name">
密码:<input type="password" class="form-control" id="password" name="pwd">

<button id="login" class="btn btn-default">登录</button>
</div>
<!-- </form> -->
</div>

<script type="text/javascript">
$(function() {
$('#login').on('click', function() {
var username = $('#userName').val();
var password = $('#password').val();
var str = {
"username": username,
"password": password
};

// 发送登录请求
$.ajax({
url: 'http://localhost:8081/app/login',
type: 'post',
dataType:"json",
contentType:"application/json",
data: JSON.stringify(str),
success: function(res) {
if (res.status) {
//将返回来的json数据存储到info键中
localStorage.setItem("info", JSON.stringify(res.data));
// 登录成功
window.location.href = "zhuye.html";
} else {
// res.preventDefault(); //阻止post提交引起的页面跳转
window.location.href = "index.html";
}
},
error:function() {
alert("系统繁忙!");
}
});

}
);
})
</script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
package com.lan.controller;

import com.lan.pojo.AjaxResult;
import com.lan.pojo.Login;
import com.lan.service.UserService;
import com.lan.utils.JsonModel;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;

@Controller
public class LoginController {

@Autowired
private UserService userService;

@ResponseBody
@RequestMapping(value = "/login", method = RequestMethod.POST)
public AjaxResult login(@RequestBody Login login) {
System.out.println(login);
AjaxResult ajaxResult = new AjaxResult();
String pwd; // 查询数据库中的密码

// 查询是否存在密码
pwd = userService.isLogin(login.getUsername());
System.out.println("数据库中的密码:"+pwd + " " + " 客户端传入的密码:"+ login.getPassword());
if (pwd.equals(login.getPassword())) {
System.out.println("登录成功!");
ajaxResult.setData(login);
ajaxResult.setStatus(1);
ajaxResult.setTotal(1);
ajaxResult.setMsg("登录成功!");
} else {
ajaxResult.setStatus(0);
ajaxResult.setMsg("登录失败!");
}
System.out.println(ajaxResult);

return ajaxResult;
}
}

运行结果:


后台获取到的数据(测试)

登录成功跳转其他页面