前端Ajax传递Json数据,后端处理两种方式
Posted runmove
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了前端Ajax传递Json数据,后端处理两种方式相关的知识,希望对你有一定的参考价值。
在这里只讨论在前端通过Ajax远程传输Json数据的,不讨论通过form的形式传递数据
第一种方式:
前端传递过来的数据刚好和我们的bean实体对象属性一致,则可以使用对象的形式接受。
前端写法:
1 $().ready(function(){ 2 var obj = JSON.stringify({‘userNo‘:‘121589‘,‘processId‘:‘15‘,‘processName‘:‘测试审批‘,‘description‘:‘这是一个测试‘}); 3 alert(obj); 4 5 //后台使用对象的形式接受 6 $.ajax({ 7 url: "testJsonOne", 8 type: "post", 9 data: obj, 10 contentType: ‘application/json;charset=utf-8‘, 11 success : function(data){ 12 alert("haha"); 13 } 14 }); 15 16 });
特别要注意的点:
1. contentType: ‘application/json;charset=utf-8‘ ,指定数据是以Json的形式传递
2.要传递的data,要是一个Json格式的字符串,最好先创建一个json对象,然后使用JSON.stringify()来转换成字符串形式
后台写法:
//对象形式接受前端数据
@RequestMapping(value= "/testJsonOne",method = RequestMethod.POST)
@ResponseBody
public String testJson(@RequestBody PoMessageVo poMessageVo) {
System.out.println(poMessageVo.toString());
return "success";
}
注意点:
1.前端数据和bean对象属性要一致
2.会使用到@RequestBody注解,而这个注解要先导入jar包的,分别是jackson-core-asl-xxx.jar和jackson-mapper-asl-xxx.jar两个包
3.注解用法不了解的话,百度一下
第二种方式:
有可能前端传递过来的数据很多很复杂,则我们可以在后端使用字符串的形式接受,具体的处理,我们在后端自己再处理。
前端写法:
//后台使用字符串的形式接受的
$.ajax({
url: "testJsonTwo",
type: "post",
//data: {jsonStr:‘nihao‘},
data: {jsonStr:obj},
//data: obj,
//contentType: ‘application/json;charset=utf-8‘,
success : function(data){
alert("haha");
}
});
注意与上面的做比较:
1. jsonStr指定后台只能以这个名称接受
2. Ajax上不用指定contentType: ‘application/json;charset=utf-8‘
后台写法:
//以字符串的形式接受前端数据
@RequestMapping(value= "/testJson",method = RequestMethod.POST)
@ResponseBody
public String testJson(String jsonStr) {
System.out.println(jsonStr);
//这里可以使用JsonMapper来处理jsonStr,比如转成需要的bean对象
return "success";
}
以上是关于前端Ajax传递Json数据,后端处理两种方式的主要内容,如果未能解决你的问题,请参考以下文章
前端ajax用post方式提交json数据给后端时,网络报错 415