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,HttpServletRequest request,HttpServletResponse response){
userService.updateUser(user);
Map<String, Object> item =new HashMap<String, Object>();
item.put("msg", "success");
return item;
}

2.如果這樣寫
var user={ id:1, username: ‘‘,address: ‘‘,telphone: ‘‘,email:‘‘, 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,HttpServletRequest request,HttpServletResponse response){
userService.addUser(user);
Map<String, Object> item =new HashMap<String, Object>();
item.put("msg", "success");
return item;
}

註:相對於angular和vue的post和put必須采用第二種寫法使用註解@RequestBody,否則無法接受到傳過來的對象。

this.user={ id:1, username: ‘‘,address: ‘‘,telphone: ‘‘,email:‘‘, image: ‘‘ };

vue:
this.$http.post(this.apiUrl + ‘/user.do‘,this.user).then((response) => {
this.queryAllUser();
});

angular:

var user={ id:1, username: ‘‘,address: ‘‘,telphone: ‘‘,email:‘‘, 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",
dataType:"json",
contentType:"application/json",
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);
}

前後端對應接口及前端ajax數據格式