異步請求獲取JSON數據
阿新 • • 發佈:2019-04-30
scrip rom java對象 ring shm nta js對象 對象 writer
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>
異步請求獲取JSON數據