zoukankan      html  css  js  c++  java
  • 异步请求获取JSON数据

    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>
  • 相关阅读:
    LA 2038 Strategic game(最小点覆盖,树形dp,二分匹配)
    UVA 10564 Paths through the Hourglass(背包)
    Codeforces Round #323 (Div. 2) D 582B Once Again...(快速幂)
    UVALive 3530 Martian Mining(贪心,dp)
    UVALive 4727 Jump(约瑟夫环,递推)
    UVALive 4731 Cellular Network(贪心,dp)
    UVA Mega Man's Mission(状压dp)
    Aizu 2456 Usoperanto (贪心)
    UVA 11404 Plalidromic Subsquence (回文子序列,LCS)
    Aizu 2304 Reverse Roads(无向流)
  • 原文地址:https://www.cnblogs.com/Nick7/p/10793065.html
Copyright © 2011-2022 走看看