SpringMVC 数据交互(Json) [ 资源分享 技术杂谈 ]
九叶的小窝 文章 正文
![As Long As You Love Me.](https://api.qwq.ro/storage/users/uid-1/1661304663.png)
九叶
{{nature("2020-12-26 16:31:55")}}更新从这个图中我们可以看出来,前台请求的数据如果是json字符串,我们需要用@RequestBody先将json字符串转成java对象,然后前台传输的是java对象的时候就需要用@ResponseBody将我们的java对象,转成json格式的字符串,这样页面才可以解析
一、@RequestBody
作用: @RequestBody注解用于读取http请求的内容(字符串),通过springmvc提供的HttpMessageConverter接口将读到的内容(json数据)转换为java对象并绑定到Controller方法的参数上。
传统 Key/Value 的请求参数:
pid=1&pname=玩具&price=70
现在的请求参数:使用POST请求,在请求体里面加入json数据
{
"pid":1,
"pname":"玩具",
"price":70
}
本例子应用:
@RequestBody注解实现接收http请求的json数据,将json数据转换为java对象进行绑定。
二、@ResponseBody
作用:
@ResponseBody注解用于将Controller的方法返回的对象,通过springmvc提供的HttpMessageConverter接口转换为指定格式的数据如:json,xml等,通过Response响应给客户端。
本例子应用:
@ResponseBody注解实现将Controller方法返回java对象转换为json响应给客户端。
三、请求,响应json实现
1. 加入jar包
如果需要springMVC支持json,必须加入json的处理jar
我们使用Jackson这个jar,如下图:
[button color="dark" icon="glyphicon glyphicon-download-alt" url="https://old.qwq.ro/usr/uploads/2020/12/3635347615.zip" type=""]相关jar包下载[/button]
2. Controller编写
@RequestMapping(value = "keyvalue")
@ResponseBody
public Product JsonKeyValue(Product product){
return product;
}
@RequestMapping(value="test_json")
@ResponseBody
public Product test_json(@RequestBody Product product){
return product;
}
3. 编写ajax测试
引入jquery文件
[button color="dark" icon="glyphicon glyphicon-download-alt" url="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js" type=""]Jquery-1.8.0.js[/button]
前台页面用(jquery实现)点击一个按钮,发起一个ajax请求,传输json数据到后台:
<%--
Created by IntelliJ IDEA.
User: JiuyeXD
Date: 2020/12/25
Time: 20:25
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Title</title>
<script type="text/javascript" src="../js/jquery-1.8.0.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#json").click(function() {
$.ajax({//ajax请求
type : 'post',//请求方法
url : 'test_json',//请求路径
contentType:"application/json;charset=UTF-8",//指定传送json格式数据,并指定编码
data : '{"pid":1,"pname":"玩具","price":70}',//json格式数据
success : function(data) {//回调函数
alert("pid: "+data.pid+", pname: "+data.pname+", price: "+data.price);
}
});
});
});
$(document).ready(function() {
var product='pid=1&pname=玩具&price=70';
$("#keyvalue").click(function() {
$.ajax({//ajax请求
type : 'post',//请求方法
url : 'keyvalue',//请求路径
data : product,//json格式数据
success : function(data) {//回调函数
alert("pid: "+data.pid+", pname: "+data.pname+", price: "+data.price);
}
});
});
});
</script>
</head>
<body>
<button id="json" type="button">Json</button>
<button id="keyvalue" type="button">Key&Value</button>
</body>
</html>
点击页面按钮测试成功
{{nature('2021-12-07 15:29:00')}} {{format('2878')}}人已阅读
{{nature('2021-01-31 20:01:00')}} {{format('1231')}}人已阅读
{{nature('2020-12-11 21:17:00')}} {{format('1158')}}人已阅读
{{nature('2021-04-22 15:16:00')}} {{format('1112')}}人已阅读
目录
标签云
一言
评论 0
{{userInfo.data?.nickname}}
{{userInfo.data?.email}}