json格式的数据广泛应用于异步请求中前后端的数据交互,本文主要介绍几种使用场景和使用方法。
1 <input type="button" id="testBtn" value="测试按钮" onclick="sentAjax();"/><br> 3 <script type="text/javascript"> 4 function sentAjax(){ 5 $.ajax({ 6 type: 'POST', 7 url:"<%=basePath%>/manage/test/ajax", 8 dataType : "json", 9 success: function(result){ 10 //这里result是一个符合json格式的js对象 11 //alert(result.name); 12 //alert(result[0].name); 13 //alert(result.listUser[0].name); 14 15 } 16 }); 17 } 18 </script>
java代码
1 @RequestMapping(value = "/ajax") 2 public void testAjax(HttpServletRequest request, HttpServletResponse response){ 3 4 try { 5 String jsonStr1 = "{"name":"张三","age":23}"; 6 String jsonStr2 = "[{"name":"张三","age":1},{"name":"李四","age":24}]"; 7 String jsonStr3 = "{"listUser": [{"name":"张三","age":1},{"name":"李四","age":24}] }"; 8 response.setCharacterEncoding("utf-8");//响应字符集的编码格式 9 response.getWriter().print(jsonStr3); 10 } catch (IOException e) { 11 e.printStackTrace(); 12 } 13 }
另外使用spring的@ResponseBody这个注解的话还可以这样写
1 @RequestMapping("/ajax") 2 @ResponseBody 3 public Object testAjax1(HttpServletRequest request, HttpServletResponse response){ 4 5 String jsonStr1 = "{"name":"张三","age":23}"; 6 String jsonStr2 = "[{"name":"张三","age":1},{"name":"李四","age":24}]"; 7 String jsonStr3 = "{"listUser": [{"name":"张三","age":1},{"name":"李四","age":24}] }"; 8 9 return jsonStr1; 10 11 }
二,java对象
@RequestMapping(value = "/ajax")
public void testAjax2(HttpServletRequest request, HttpServletResponse response){
try {
User user = new User();
user.setName("张三");
user.setAge(23);
JSONObject jsonObject = JSONObject.fromObject(user);
response.setCharacterEncoding("utf-8");//响应字符集的编码格式
response.getWriter().print(jsonObject.toString());
} catch (IOException e) {
e.printStackTrace();
}
}
使用以上的方式的话要先把java对象转换成json格式的字符串。
下面使用springmvc的@ResponseBody这个注解,也是在springmvc的web项目开发中经常用到的。
@RequestMapping(value = "/ajax")
@ResponseBody
public Object testAjax3(HttpServletRequest request, HttpServletResponse response){
User user = new User();
user.setName("张三");
user.setAge(23);
return user;
}
在这里@ResponseBody这个注解对于json格式数据的解析用到了jackson这个框架另外它对响应对象response进行了封装,这让我们在异步请求中使用json格式的数据进行数据交互更加的方便。它的实现原理如下:
1 @RequestMapping(value = "/ajax4") 2 public void testAjax4(HttpServletRequest request, HttpServletResponse response){ 3 4 try { 5 User user = new User(); 6 user.setName("张三"); 7 user.setAge(23); 8 ObjectMapper mapper = new ObjectMapper(); 9 String userStr = mapper.writeValueAsString(user); 10 response.setCharacterEncoding("utf-8");//响应字符集的编码格式 11 response.getWriter().print(userStr); 12 } catch (IOException e) { 13 e.printStackTrace(); 14 } 15 }
另外在使用json格式数据交互时如有以下用法:
1 @RequestMapping(value = "/ajax5") 2 @ResponseBody 3 public Object testAjax5(HttpServletRequest request, HttpServletResponse response){ 4 5 Map<String,Object> jsonMap = new HashMap(); 6 String jsonStr1 = "{"name":"张三","age":23}"; 7 jsonMap.put("json", jsonStr1); 8 9 return jsonMap; 10 }
前端应该这么写
<script type="text/javascript"> function sentAjax(){ $.ajax({ type: 'POST', url:"<%=basePath%>/manage/test/ajax5", dataType : "json", success: function(result){ //result.json取到的只是map在前端转换成json格式js对象时key为'json'对应的字符串的值,在前段json格式的字符串转换成json格式js对象推荐使用 JSON.parse()这个函数。 var jsonStr = JSON.parse(result.json); alert(jsonStr.name) } }); } </script>