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数据格式
原文地址：https://www.cnblogs.com/xmyfsj/p/9783582.html