SpringMVC json数据交互
程序员文章站
2024-01-12 19:46:10
...
SpringMVC 与json数据交互
json数据格式在前端框架中较常用，json格式比较简单，解析还比较方便
2.1进行json交互的两种情况
- 客户端请求的是key/value，contentType=application/x-www-form-urlencoded默认，不需要使用
@RequestBody。但仍然需要使用@ResponseBody注解将java对象转成json串输出 - 客户端请求的是json字符串，需要指定contentType=application/json，需要使用@RequestBody注解将
json串转成java对象。并使用@ResponseBody注解将java对象转成json串输出
2.2 导入jackson包
maven依赖配置：
<!-- jackson -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-core</artifactId>
<version>2.9.5</version>
</dependency>
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.9.5</version>
</dependency>
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-annotations</artifactId>
<version>2.9.5</version>
</dependency>
注意：spring4.x须使用jackson2.x版本，而spring3.x版本使用jackson1.x版本
2.3 配置json转换器
使用<mvc:annotation-driven />即可
2.4 json交互测试
1.请求key/value
页面js:
<script src="js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
<script >
function keyvlaue(){
$.ajax({
url : "keyValue.do",
type : "post",
contentType : "application/x-www-form-urlencoded",
data : {
empno : 1001,
ename : "tom",
job : "clerk",
salary : 2580
},
success : function(data){
alert(data);
}
});
}
</script>
</head>
<body>
<button onclick="keyvlaue()" >测试 key/value的方法</button>
</body>
Controller方法：
@PosttMapping("/keyValue.do")
public void testKeyValue(Emp emp, HttpServletResponse response) throws IOException
{
System.out.println("提交数据为key/value格式...");
System.out.println(emp);
response.getWriter().write("ok");
}
测试结果：
2.请求json字符串
页面js：
function jsonString(){
$.ajax({
url : "jsonString.do",
type : "post",
contentType : "application/json",
data : JSON.stringify({
empno : 1002,
ename : "jerry",
job : "clerk",
salary : 3690
}),
success : function(data){
alert(data);
}
});
}
<button onclick="jsonString()" >测试 请求json字符串的方法</button>
Controller方法：
@PosttMapping("/jsonString.do")
public void testJsonString(@RequestBody Emp emp, HttpServletResponse response)
throws IOException {
System.out.println("提交数据为jsonString格式...");
System.out.println(emp);
response.getWriter().write("ok");
}
测试结果：
3.响应json对象
页面js：
function responseEntity(){
$.ajax({
url : "responseEntity.do",
type : "post",
success : function(data){
var html = "员工编号：" + data.empno;
html += " 员工姓名：" + data.ename;
html += " 员工岗位：" + data.job;
html += " 员工工资：" + data.salary;
$("#info").html(html);
}
}
Controller方法：
@RequestMapping("/responseEntity.do")
@ResponseBody
public Emp testResponseEntity(){
Emp emp = new Emp();
emp.setEmpno(1003);
emp.setEname("chris");
emp.setJob("manager");
emp.setSalary(4560.5);
return emp;
}
测试结果：
4.响应json数组
页面js：
function responseList(){
$.ajax({
url : "responseList.do",
type : "post",
success : function(data){
var html = "";
$.each(data, function(i,emp){
html += "<p>";
html += "员工编号：" + emp.empno;
html += " 员工姓名：" + emp.ename;
html += " 员工岗位：" + emp.job;
html += " 员工工资：" + emp.salary;
html += "</p>";
});
$("#info").html(html);
}
});
}
Controller方法：
@RequestMapping("/responseList.do")
@ResponseBody
public List<Emp> testResponseList(){
List<Emp> list = new ArrayList<Emp>();
Emp e1 = new Emp(101,"zhangsan","aaa",123.0);
Emp e2 = new Emp(102,"lisi","bbb",456.9);
Emp e3 = new Emp(103,"wangwu","ccc",789.5);
list.add(e1);
list.add(e2);
list.add(e3);
return list;
}
测试结果：
下一篇： 英语部分词汇技巧