springmvc 接收 ajax 请求

转载自:https://www.cnblogs.com/oyx305/p/5220751.html

 

一.传json单值或对象

1.前端

复制代码
 1 var data = {'id':id,'name':name};
 2 $.ajax({ 
 3             type:"POST", 
 4             url:"user/saveUser", 
 5             dataType:"json",      
 6             //contentType:"application/json", //不能添加这个头           
 7             data:data, //这里不能进行JSON.stringify,发送请求的数据在:form data
 8             success:function(data){ 
 9                                        
10             } 
11          }); 
复制代码

2.后端

复制代码
//看成单值
@RequestMapping(value = "save", method = {RequestMethod.POST }}) 
     @ResponseBody  
     public void save(@RequestParam int id,String name) { //这里字段要跟前端一致,@RequsetParam 可以不加,默认调用的就是它
          
     }
//看成对象
@RequestMapping(value = "save", method = {RequestMethod.POST }}) 
     @ResponseBody  
     public void save(User user) { //前端字段跟对象属性一致
                                   //自动转化成改对象
     }
复制代码

二.json对象转成字符串后传值

1.1、前端

复制代码
$.ajax({ 
              type:"POST", 
              url:"user/saveUser", 
              dataType:"json",      
              contentType:"application/json", //需添加这个头           
              data:JSON.stringify(data), //发送请求的数据在request payload
              success:function(data){ 
                                        
             } 
          }); 
复制代码

1.2、后端

//看成对象
@RequestMapping(value = "save", method = {RequestMethod.POST }}) 
     @ResponseBody  
     public void save(@RequestBody User user) { //需添加RequestBody注解
                                   //自动转化成改对象
     }

三.将对象JSON.stringify后,以第一种方式传递,可实现对象中存对象 {'userList':users,'key1':value1}

1.前台

复制代码
var user = {'id':id,'name':name};
var jsonStrGoods = JSON.stringify({'gid':gid,...});
$.ajax({ 
              type:"POST", 
              url:"user/saveUser", 
              dataType:"json",      
             // contentType:"application/json", //不添加这个头           
              data:{'user':JSON.stringify(user),'goods':jsonStrGoods }, //发送请求的数据在request payload
              success:function(data){ 
                                        
             } 
          }); 
复制代码

2.后台

复制代码
//看成单值
@RequestMapping(value = "save", method = {RequestMethod.POST }}) 
     @ResponseBody  
     public void save(@RequestParam String user,String goods) { //这里字段要跟前端一致,@RequsetParam 可以不加,默认调用的就是它
          User u= JSON.parseObject(user, User .class);//alibaba.fastjson转换成对象
     }
//看成对象
@RequestMapping(value = "save", method = {RequestMethod.POST }}) 
     @ResponseBody  
     public void save(UserAndGoods ug) { //没试过,猜测应该是这样,前端字段跟对象属性一致
                                   //自动转化成改对象
     }
复制代码

传数组

前台

 

复制代码
var arr = str.split(',');
    $.ajax({
        url:'/appollo-console/manage/user/names/validation',
        data:{
            names:arr
        },
traditional: true,//必须
        type:'post',
dataType:'json',
        success:function(res){
            alert(res);
        }
    })
复制代码

 

后台

1
2
3
4
5
6
7
8
@PostMapping("/names/validation")
    @ResponseBody
    public List<String> validateUserName(String[] names){
        List<String> notValidNames = Lists.newArrayList();
        notValidNames = userService.findNotValidNames(Arrays.asList(names));
        return notValidNames;
    }
    

 

 

 

总结:1.如果用JSON.stringify()将对象转成字符串,就需要在ajax请求中指定contentType 为 application/json,且后台需添加 @RequestBody注解;

   2.如果直接传json对象则跟上面的相反,不能指定contentType为 application/json,其默认类型是 application/x-www-form-urlencoded 

springmvc 前端 发ajax请求的几种方式

 

一.传json单值或对象

1.前端

复制代码
 1 var data = {'id':id,'name':name};
 2 $.ajax({ 
 3             type:"POST", 
 4             url:"user/saveUser", 
 5             dataType:"json",      
 6             //contentType:"application/json", //不能添加这个头           
 7             data:data, //这里不能进行JSON.stringify,发送请求的数据在:form data
 8             success:function(data){ 
 9                                        
10             } 
11          }); 
复制代码

2.后端

复制代码
//看成单值
@RequestMapping(value = "save", method = {RequestMethod.POST }}) 
     @ResponseBody  
     public void save(@RequestParam int id,String name) { //这里字段要跟前端一致,@RequsetParam 可以不加,默认调用的就是它
          
     }
//看成对象
@RequestMapping(value = "save", method = {RequestMethod.POST }}) 
     @ResponseBody  
     public void save(User user) { //前端字段跟对象属性一致
                                   //自动转化成改对象
     }
复制代码

二.json对象转成字符串后传值

1.1、前端

复制代码
$.ajax({ 
              type:"POST", 
              url:"user/saveUser", 
              dataType:"json",      
              contentType:"application/json", //需添加这个头           
              data:JSON.stringify(data), //发送请求的数据在request payload
              success:function(data){ 
                                        
             } 
          }); 
复制代码

1.2、后端

//看成对象
@RequestMapping(value = "save", method = {RequestMethod.POST }}) 
     @ResponseBody  
     public void save(@RequestBody User user) { //需添加RequestBody注解
                                   //自动转化成改对象
     }

三.将对象JSON.stringify后,以第一种方式传递,可实现对象中存对象 {'userList':users,'key1':value1}

1.前台

复制代码
var user = {'id':id,'name':name};
var jsonStrGoods = JSON.stringify({'gid':gid,...});
$.ajax({ 
              type:"POST", 
              url:"user/saveUser", 
              dataType:"json",      
             // contentType:"application/json", //不添加这个头           
              data:{'user':JSON.stringify(user),'goods':jsonStrGoods }, //发送请求的数据在request payload
              success:function(data){ 
                                        
             } 
          }); 
复制代码

2.后台

复制代码
//看成单值
@RequestMapping(value = "save", method = {RequestMethod.POST }}) 
     @ResponseBody  
     public void save(@RequestParam String user,String goods) { //这里字段要跟前端一致,@RequsetParam 可以不加,默认调用的就是它
          User u= JSON.parseObject(user, User .class);//alibaba.fastjson转换成对象
     }
//看成对象
@RequestMapping(value = "save", method = {RequestMethod.POST }}) 
     @ResponseBody  
     public void save(UserAndGoods ug) { //没试过,猜测应该是这样,前端字段跟对象属性一致
                                   //自动转化成改对象
     }
复制代码

传数组

前台

 

复制代码
var arr = str.split(',');
    $.ajax({
        url:'/appollo-console/manage/user/names/validation',
        data:{
            names:arr
        },
traditional: true,//必须
        type:'post',
dataType:'json',
        success:function(res){
            alert(res);
        }
    })
复制代码

 

后台

1
2
3
4
5
6
7
8
@PostMapping("/names/validation")
    @ResponseBody
    public List<String> validateUserName(String[] names){
        List<String> notValidNames = Lists.newArrayList();
        notValidNames = userService.findNotValidNames(Arrays.asList(names));
        return notValidNames;
    }
    

 

 

 

总结:1.如果用JSON.stringify()将对象转成字符串,就需要在ajax请求中指定contentType 为 application/json,且后台需添加 @RequestBody注解;

   2.如果直接传json对象则跟上面的相反,不能指定contentType为 application/json,其默认类型是 application/x-www-form-urlencoded 

 
 
好文要顶 关注我 收藏该文
1
0
 
 
 
« 上一篇:java 图片质量压缩
» 下一篇:maven 打包时mapper.xml打不进去问题
posted @ 2016-02-26 16:06 until-u 阅读(5081) 评论(0) 编辑 收藏
 

 

 
 

 

posted @ 2019-01-20 16:30  智遴  阅读(1766)  评论(0编辑  收藏  举报