SpringMVC使用@RequestBody与@ResponseBody注解与前台进行json格式的数据 剖析

SpringMVC使用@RequestBody与@ResponseBody注解与前台进行json格式的数据

一、前端页面代码

1. <form id= "reForm" action= "">
2. <table>
3. <tr>
4. <td>姓名：</td>
5. <td><input name= "username" type= "text"></td>
6. </tr>
7. <tr>
8. <td>年龄：</td>
9. <td><input name= "age" type= "text"></td>
10. </tr>
11. <tr>
12. <td>家庭住址：</td>
13. <td><input name= "address" type= "text"></td>
14. </tr>
15. </table>
16. </form>
17. <div style= "text-align: center">
18. <p><button id= "commit">话费充值</button></p>
19. </div>

二、页面JS代码

1. <script type= "text/javascript" src= "./js/jquery-1.8.3.js"> </script>
2. <script type= "text/javascript">
3. $( function(){
4. $( "#commit").click( function(){
6. // 1、使用JQ获取整个form表单的数据,获得的对象是个Object数组
7. var form = $( "#reForm").serializeArray(); //[Object][Object][Object]
9. // 2、用来保存遍历数组后的数据，获得的对象是一个Object
10. var source = {};
11. $.each(form, function(i,n){
12. source[form[i].name] = form[i].value;
13. });
15. // 3、从Object对象中提取成json字符串
16. var data = JSON.stringify(source); //{"name":"John","age":24,"address":"USA"}
18. // 4、本人使用的是利用ajax进行传值，由于是采用Json格式传值，需要设置 "contentType='application/json'"
19. // 但是只有 $.ajax() 方法有这个属性选项，如果要使用$.get()或者$.post()方法需要重写，这里不做介绍，需要的自行百度
20. /*
21. $.post("${pageContext.request.contextPath}/Freemarker/json.action",
22. {"data":data},function(msg){
23. alert(msg);
24. },"json"); /不可直接使用
25. */
26. $.ajax({
27. url: "${pageContext.request.contextPath}/Freemarker/json.action",
28. type: "POST",
29. data:data,
30. contentType: "application/json",
31. dataType: "json",
32. success: function(msg){
33. alert(msg);
34. }
35. });
36. });
37. });
38. </script>

三、后端Java代码

1. @RequestMapping( "/json.action")
2. public @ResponseBody User json(@RequestBody User data){
3. System.out.println(data.toString());
4. //输出结果为User [username=John, age=24, address=USA]（toString()方法）
5. return data;
6. }

四、一些注意事项

1、需要 jackson包的支持，本人使用的是maven创建项目，只需要在pom.xml中配置下即可

     创建普通Web项目 导入下图中的三个包即可。

1. <dependency>
2. <groupId>com.fasterxml.jackson.core </groupId>
3. <artifactId>jackson-databind </artifactId>
4. </dependency>

注： 只需要配置jackson-databind即可，其它两个包会依赖注入。

2、使用的ajax必须设置contentType属性为application/json。

3、springmvc是配置文件中开启自动配置处理器映射器与处理器适配器

1. <!-- 使用注解配置处理器映射器与处理器适配器 -->
2. <mvc:annotation-driven/>

4、 如果需要后端向前端传递数据就必须使用@ResponseBody注解，否则会报错