前后端对应接口及前端ajax数据格式

1.如果前端这么写post请求
$.ajax({
? url: this.apiUrl + "/register.do",
? type: "POST",
? data:{
? ? "username":this.user.username,
? ?"email":this.user.email,
? ?"telphone":this.user.telphone,
? ?"address":this.user.address,
? ?"password":this.user.password,
? ?"image":‘/images/3846f125f0524459a284cf970493c077xzq.jpg‘
},
dataType:"json",
success:function(data){
alert("注册用户成功!");
}
});

//Java后端这样写即可
@RequestMapping(value={"/register"},method={org.springframework.web.bind.annotation.RequestMethod.POST})
@ResponseBody
public Map<String,Object> user_register(User user,HttpServletRequest request,HttpServletResponse response){
user.setPassword(user.getPassword());
userService.addUser(user);
Map<String,Object> item =new HashMap<String,Object>();
item.put("msg","success");
return item;
}

而PUT请求却需要这样写，后台才能接受到参数。（暂时不知到为什么）
var usertemplate={ id:1,username: ‘‘,address: ‘‘,telphone: ‘‘,email:‘‘,image: ‘‘};
$.ajax({
? url: this.apiUrl + "/modify.do",
? type: "PUT",
? data:JSON.stringify(this.usertemplate),
? dataType:"json",
? contentType:"application/json",
? success:function(data){
? ? ?alert("修改用户成功!");
? ? alert(this.user.id);
? }
});

//修改用户信息(PUT方式)
@RequestMapping(value={"/modify"},method={org.springframework.web.bind.annotation.RequestMethod.PUT})
@ResponseBody
public Map<String,Object> user_modify(@RequestBody User user,HttpServletResponse response){
userService.updateUser(user);
Map<String,"success");
return item;
}

2.如果这样写 var user={ id:1,image: ‘‘ }; $.ajax({ url:this.restApiUrl + "/user.do",type: "POST",data:JSON.stringify(user),dataType:"json",contentType:"application/json",success:function(data){ alert("注册用户成功!"); } }); //Java后端这样写即可 @RequestMapping(value={"/user"},method={org.springframework.web.bind.annotation.RequestMethod.POST}) @ResponseBody public Map<String,Object> user_register(@RequestBody User user,HttpServletResponse response){ userService.addUser(user); Map<String,Object>(); item.put("msg","success"); return item; } 注:相对于angular和vue的post和put必须采用第二种写法使用注解@RequestBody,否则无法接受到传过来的对象。 this.user={ id:1,image: ‘‘ }; vue: this.$http.post(this.apiUrl + ‘/user.do‘,this.user).then((response) => { this.queryAllUser(); }); angular: var user={ id:1,image: ‘‘ }; $http.post(this.apiUrl + ‘/user.do‘,user).success(function(data) { console.log(data); }).error(function(err) { //错误代码 }); 3.意外看到这种写法 <script type="text/javascript"> $(document).ready(function(){ var userDataArry=[]; var user1=={"username":"admin","address":"hubei"}; var user2={"username":"root","address":"hunan"}; userDataArry.push(user1); userDataArry.push(user2); $.ajax({ type:"POST",url:"user/saveUser",data:JSON.stringify(userDataArry),success:function(data){ } }); }); </script> //Java后端这样写即可 @RequestMapping(value = "saveUser",method = {RequestMethod.POST }}) @ResponseBody public void saveUser(@RequestBody List<User> users) { userService.batchSave(users); }