spring MVC-异步请求发送参数_springmvc异步请求-CSDN博客

本文详细介绍了如何使用Ajax进行不同类型的参数传递，包括普通参数、POJO对象及列表，并展示了如何返回字符串、JSON数据及JSON数组。此外，还探讨了跨域请求的概念及实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

传一个普通参数

传一个普通参数

       $.ajax({
               //请求方式：POST请求
               type:"POST",
               //请求的地址
               url:"ajaxController",
               //请求参数（也就是请求内容）
               data:'ajax message',
               //响应正文类型
               dataType:"text",
               //请求正文的MIME类型
               contentType:"application/text",
            });
        });

    @RequestMapping("/ajaxController")
    //使用@RequestBody注解，可以将请求体内容封装到指定参数中
    public String ajaxController(@RequestBody String message){
        System.out.println("ajax request is running..."+message);
        return "page.jsp";
    }

传一个pojo

            $.ajax({
               type:"POST",
               url:"ajaxPojoToController",
               data:'{"name":"Jock","age":39}',
               dataType:"text",
               contentType:"application/json",
            });

   @RequestMapping("/ajaxPojoToController")
    //如果处理参数是POJO，且页面发送的请求数据格式与POJO中的属性对应，@RequestBody注解可以自动映射对应请求数据到POJO中
    //注意：POJO中的属性如果请求数据中没有，属性值为null，POJO中没有的属性如果请求数据中有，不进行映射
    public String  ajaxPojoToController(@RequestBody User user){
        System.out.println("controller pojo :"+user);
        return "page.jsp";
    }

传一个list

            $.ajax({
               type:"POST",
               url:"ajaxListToController",
               data:'[{"name":"Jock","age":39},{"name":"Jockme","age":40}]',
               dataType:"text",
               contentType:"application/json",
            });

    @RequestMapping("/ajaxListToController")
    //如果处理参数是List集合且封装了POJO，且页面发送的数据是JSON格式的对象数组，数据将自动映射到集合参数中
    public String  ajaxListToController(@RequestBody List<User> userList){
        System.out.println("controller list :"+userList);
        return "page.jsp";
    }

返回字符串数据

   $.ajax({
      type:"POST",
      url:"ajaxReturnString",
      //回调函数
      success:function(data){
       //打印返回结果
      alert(data);
      }
    });

    //使用注解@ResponseBody可以将返回的页面不进行解析，直接返回字符串，该注解可以添加到方法上方或返回值前面
    @RequestMapping("/ajaxReturnString")
//    @ResponseBody
    public @ResponseBody String ajaxReturnString(){
        System.out.println("controller return string ...");
        return "page.jsp";
    }

返回json 数据

            $.ajax({
               type:"POST",
               url:"ajaxReturnJson",
               //回调函数
               success:function(data){
                    alert(data);
                    alert(data['name']+" ,  "+data['age']);
               }
            });

    @RequestMapping("/ajaxReturnJson")
    @ResponseBody
    //基于jackon技术，使用@ResponseBody注解可以将返回的POJO对象转成json格式数据
    public User ajaxReturnJson(){
        System.out.println("controller return json pojo...");
        User user = new User();
        user.setUsername("Jockme");
        user.setAge(39);
        return user;
    }

返回jsons数组

            $.ajax({
               type:"POST",
               url:"ajaxReturnJsonList",
               //回调函数
               success:function(data){
                    alert(data);
                    alert(data.length);
                    alert(data[0]["name"]);
                    alert(data[1]["age"]);
               }
            });

    @RequestMapping("/ajaxReturnJsonList")
    @ResponseBody
    //基于jackon技术，使用@ResponseBody注解可以将返回的保存POJO对象的集合转成json数组格式数据
    public List ajaxReturnJsonList(){
        System.out.println("controller return json list...");
        User user1 = new User();
        user1.setUsername("Tom");
        user1.setAge(3);

        User user2 = new User();
        user2.setUsername("Jerry");
        user2.setAge(5);

        ArrayList al = new ArrayList();
        al.add(user1);
        al.add(user2);

        return al;
    }

跨域请求

什么是跨域？

跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对JavaScript施加的安全限制。

所谓同源是指，域名，协议，端口均相同，

hosts文件
127.0.0.1  www.baidu.com

            $.ajax({
               type:"POST",
               url:"http://www.jock.com/cross",
               //回调函数
               success:function(data){
                   alert("跨域调用信息反馈："+data['name']+" ,  "+data['age']);
               }
            });

    @RequestMapping("/cross")
    @ResponseBody
    //使用@CrossOrigin开启跨域访问
    //标注在处理器方法上方表示该方法支持跨域访问
    //标注在处理器类上方表示该处理器类中的所有处理器方法均支持跨域访问
    @CrossOrigin
    public User cross(HttpServletRequest request){
        System.out.println("controller cross..."+request.getRequestURL());
        User user = new User();
        user.setUsername("Jockme");
        user.setAge(39);
        return user;
    }