前言
前后端的数据交互，除了通过form表单进行提交外，也可以通过ajax向后端传递和接收 json 格式数据（这种方式可以实现请求数据和页面分离）。本文将总结一下在spring mvc中接收和响应json数据的几种方式。
话不多说了，来一起看看详细的介绍吧
准备步骤：
1.导入json相关框架的依赖（比如jackson）。
2.spring mvc的controller方法正常写，如果需要响应json，增加@responsebody注解。
3.在接受json对应的输入参数前，加上@requestbody注解。
服务端接收json数据还原为java对象，称为反序列化，反之，将java对象作为响应转换为json数据发回给客户端，称为序列化。
注意： 因为要使用ajax，所有一定要引入jquery，切记！
jackson maven依赖:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<!-- jackson依赖 --> <dependency> <groupid>com.fasterxml.jackson.core</groupid> <artifactid>jackson-core</artifactid> <version> 2.7 . 0 </version> </dependency> <dependency> <groupid>com.fasterxml.jackson.core</groupid> <artifactid>jackson-databind</artifactid> <version> 2.7 . 0 </version> </dependency> <dependency> <groupid>com.fasterxml.jackson.core</groupid> <artifactid>jackson-annotations</artifactid> <version> 2.7 . 0 </version> </dependency> |
一、以实体类接收
背景：当ajax传递的参数较多时，采用参数名匹配的方法不太方便。如果后台有对应的实体类，这时可以选择在客户端将数据封装为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 |
<button onclick= "clickme()" >点我</button> <script> function clickme() { $.ajax({ type : 'post' , url : "acceptjsonbyentity" , contenttype : "application/json;charset=utf-8" , // 如果想以json格式把数据提交到后台的话，json.stringify()必须有，否则只会当做表单提交 data : json.stringify({ "bookid" : 1 , "author" : "jack" }), // 期待返回的数据类型 datatype : "json" , success : function(data) { var bookid = data.bookid; var author = data.author; alert( "success:" + bookid+ ',' +author); }, error : function(data) { alert( "error" + data); } }); </script> |
@responsebody注解是将controller的方法返回的对象通过适当的转换器转换为指定的格式之后，写入到response对象的body区，通常用来返回json数据或者是xml。
@requestbody注解常用来处理content-type不是默认的application/x-www-form-urlcoded编码的内容。一般情况下来说常用其来处理application/json类型。
controller:
|
1 2 3 4 5 6 7 8 9 10 |
@controller public class passjsonparam { @requestmapping (value= "acceptjsonbyentity" ,method = requestmethod.post) @responsebody public book acceptjsonbyentity( @requestbody book book, httpservletrequest request){ system.out.println( "当前http请求方式为:" +request.getmethod()); system.out.println( "bookid=" +book.getbookid()+ ", author=" +book.getauthor()); return book; } } |
控制台输出：当前http请求方式为:post bookid=1, author=jack
客户端（弹窗）：success:1,jack
如果controller中的所有方法都需要返回json格式数据，可以使用@restcontroller注解。
@restcontroller = @controller + @responsebody
controller（上面的controller可以用下面的替换）:
|
1 2 3 4 5 6 7 8 9 |
@restcontroller public class passjsonparam { @requestmapping (value= "acceptjsonbyentity" ,method = requestmethod.post) public book acceptjsonbyentity( @requestbody book book, httpservletrequest request){ system.out.println( "当前http请求方式为:" +request.getmethod()); system.out.println( "bookid=" +book.getbookid()+ ", author=" +book.getauthor()); return book; } } |
注意： 使用了@restcontroller注解后，controller的方法无法再返回jsp页面或者html，配置的视图解析器也不会起作用。
二、以map方式接收
背景：前台向后台发送ajax请求并且携带很多参数，而后台并没有对应的实体类进行接收又该如何处理呢？最常见的就是表单，这里可以考虑使用map来解决。因为map的数据结构为key-value形式，所以我们可以遍历搜索框表单，将表单的name作为map的key,表单的value作为map的value。
客户端：
|
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 |
<form id= "bookform" > <input type= "text" name= "bookname" id= "bookname" > <input type= "text" name= "author" id= "author" > <button onclick= "submitform(event)" >提交</button> </form>
<script> function submitform(event) { //阻止form默认事件 event.preventdefault(); //得到搜索框数据 var map = new map(); $( "#bookform input" ).each(function () { var value = $( this ).val(); //input 值 var name = $( this ).attr( 'name' ); map.set(name,value); })
//map转为json的方法 var obj= object.create( null ); for (var [k,v] of map) { obj[k] = v; }
$.ajax({ type: 'post' , contenttype: 'application/json' , url: "acceptjsonbymap" , data: json.stringify(obj), datatype: 'json' , success: function (data) { var bookname = data.bookname; var author = data.author; alert( "bookname =" +bookname+ "; author=" +author); }, error: function (data) { alert( "失败啦" ); } }); } </script> |
controller:
|
1 2 3 4 5 6 7 |
@requestmapping (value= "acceptjsonbymap" ) @responsebody public map<string,object> acceptjsonbymap( @requestbody map<string,object> paramsmap, httpservletrequest request){ system.out.println( "当前http请求方式为:" +request.getmethod()); system.out.println(paramsmap); return paramsmap; } |
控制台输出：当前http请求方式为:post {bookname=love, author=frank}
客户端（弹窗）：bookname =love; author=frank
三、以list方式接收(以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 |
<button onclick= "clickhere()" >clickhere</button> <script> function clickhere() { var params1 = { "bookid" : "123" , "author" : "rose" }; var params2 = { "bookid" : "321" , "author" : "jack" }; var list = []; list.push(params1); list.push(params2);
$.ajax({ type: 'post' , contenttype: 'application/json' , url: "acceptjsonbylist" , data: json.stringify(list), datatype: 'json' , success: function (data) { for (let i = 0 ; i < data.length; i++) { var bookid = data[i].bookid; var author = data[i].author; alert( "bookid =" +bookid+ "; author=" +author); } }, error: function (data) { alert( "失败啦" ); } }); } </script> |
注意： 传递到后端时,list应为[ { key1 : value1}{ key2 : value2} ]的json格式数据，否则可能会出现json parse error错误。
controller:
|
1 2 3 4 5 6 7 |
@requestmapping (value= "acceptjsonbylist" ) @responsebody public list<book> acceptjsonbylist( @requestbody list<book> book, httpservletrequest request){ system.out.println( "当前http请求方式为:" +request.getmethod()); system.out.println(book); return book; } |
注意： 这里需要book实体类进行接收。
控制台输出：当前http请求方式为:post [entity.book@1138a75c, entity.book@22d1cbcf]
客户端（弹窗）：bookid =123; author=rose bookid =321; author=jack
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，谢谢大家对的支持。
原文链接：https://segmentfault测试数据/a/1190000018455694
查看更多关于SpringMVC接收与响应json数据的几种方式的详细内容...