ajax前台和后台json数据传输问题

前台js代码如下：

		<!--页脚结束-->
	<script type="text/javascript">
	// 页面初始化时加载用户数据
	$(document).ready(function() {
		// 将请求提交到哪里
		var url = "../user/info.do";
		// 发出ajax请求，并处理结果
		$.ajax({
			"url": url,
			"type": "POST",// 请求方式
			"dataType": "json",// 数据类型
			"success": function(json) {
				var user = json.data;// 请求成功后，获取后台返回的数据
				$("#username").val(user.username);
				$("#phone").val(user.phone);
				$("#email").val(user.email);
				if (user.gender == 0) {
					$("#gender-female").attr("checked", "checked");
				}
				if (user.gender == 1) {
					$("#gender-male").attr("checked", "checked");
				}
			}
		});
	});
	
	// 为修改按钮绑定单击事件
	$("#btn-change").click(function() {
		// 将请求提交到哪里
		var url = "../user/change_info.do";
		// 将表单序列化后，传数据到后台
		var data = $("#form-change-info").serialize();
		console.log("修改个人资料参数：" + data);
		// 发出ajax请求，并处理结果
		$.ajax({
			"url": url,
			"data": data,
			"type": "POST",
			"dataType": "json",
			"success": function(json) {
				if (json.state == 200) {
					alert("修改成功！");
				} else {
					alert(json.message);
				}
			},
			"error": function(xhr, text, errorThrown) {// 发生错误执行的方法
				console.log("xhr.status=" + xhr.status);
				
				alert("您的登录信息已经过期！请重新登录！");
				location.href = "login.html";
			}
		});
	});
	</script>

后台Controller代码如下：

@RequestMapping("/info.do")
@ResponseBody// 将数据自动转换成指定的格式（这里是json格式），然后返回给前台
public ResponseResult<User> getInfo(
	HttpSession session) {
	// 获取当前登录的用户的id
	Integer id = getUidFromSession(session);
	// 执行查询，获取用户数据
	User user = userService.getById(id);
	// 返回
	return new ResponseResult<User>(SUCCESS, user);
}

@PostMapping("/change_info.do")
public ResponseResult<Void> changeInfo(User user, HttpSession session) {
	// 获取当前登录的用户的id
	Integer id = getUidFromSession(session);
	// 将id封装到参数user中，因为user是用户提交的数据，并不包含id
	user.setId(id);
	// 执行修改
	userService.changeInfo(user);
	// 返回
	return new ResponseResult<>(SUCCESS);
}

**

• 下面是一些容易混乱的地方：

**

springMvc中前台ajax传json数据后台controller接受对象为null

一般地，出现这种情况很大一部分原因是对ajax中的参数作用不熟悉或者对@RequestBody注解不熟悉。

在jquery的ajax中，如果没加contentType:“application/json”，那么data就应该对应的是json对象，反之，如果加了contentType:“application/json”，那么ajax发送的就必须是字符串。为什么呢？contentType参数指定的是浏览器将发送什么样类型的编码，比如

 text/html ： HTML格式

 text/plain ：纯文本格式      

 text/xml ：  XML格式

 mage/gif ：gif图片

 image/jpeg ：jpg图片格式 

 image/png：png图片格式

 application/json  ：json数据格式

 application/pdf   ：pdf格式  

 application/octet-stream ： 二进制流数据

等等。。。

而你不指定contentType则代表为默认的application/x-www-form-urlencoded（表单）类型，这种类型有一个好处，它可以支持很多种情况，并能配合查询字符串（key1=value1&key2=vlaue2）的形式发送到服务器。而且这种默认类型可以很好地配合参数processData（默认为true，可以不用管他），该参数为true的时候，开启自动转化功能，只要是一个合法对象，都能将该对象自动地转化成查询字符串的形式。所以，在contentType默认的情况下(即不写)，ajax里的data参数既可以这么传：

    $.ajax({

     url:"http://xxxxxx",

     data: { "username" : "ccc" } ,  //查询字符串的映射形式（即对象），在默认模式下提交时会自动地转化成查询字符串

     .....     

});

也可以这么传：

    $.ajax({

     url:"http://xxxxxx",

     data: "username=ccc",   //查询字符串形式

     .....     

});

所以看到这里，差不多也能知道为什么指定了contentType : "application/json"后，data就只能是字符串而且必须是json字符串了，首先你指定json格式，那提交格式肯定与json有关，再一个，因为你指定了"application/json"就意味着你放弃了"application/x-www-form-urlencoded"这种默认模式，默认模式虽可以自动地转化对象，不见得"application/json"这种格式就会自动帮你转，而事实证明，它确实不会帮你自动转。

下面便是两种犯错的例子：

1>前台ajax多加了contentType:“application/json”，data却错传成json对象：

后台处理：（employee该pojo对象里有username和password等String字段）

结果都为null

将contentType去掉后，

后台成功反射出对象：

2>ajax中没加contentType:“application/json”，data却直接使用了json字符串（和上面的一个道理）

后台情况：

有人就会说，去掉“application/json” 后的默认模式应该是支持字符串和对象的啊，是的，默认模式确实是可以支持两者，但是要看清楚，默认默认支持的字符串是什么？是json字符串吗？不！是查询字符串。

那么如何在application/json这种非默认模式下让Mvc后台接收到收据呢？这里就需要用到@RequestBody注解了，很巧，这个注解就是专门用来处理非默认模式下的请求的。如果上图加了"application/json"那么controller就应该这么接收：

@RequestMapping(“xxx”)

…

public String test(@RequestBody Employee employee) {

…

}

3>第三点是真的有点恶心的一点，找了好久才找到。。

那就是 有些 关键的属性在Mvc层中反射失败，会导致其他所有属性都为null



比如上面的joindate对应的pojo是Date，本来input框里的值是 Thu Dec 30 00:00:00 CST 1999 ，传到后台用Date接收，但是显然格式不对，于是Date合成出了错，然后坑爹的就来了，因为这个特殊的属性反射失败，Mvc层就将请求打回去然后导致浏览器报错400 bad request ，从而导致其他所有属性都为null。最后把joindate属性注释掉，后台什么属性的值都收到了。。

希望能够帮到大家！

补充：在"application/json"的时候，ajax请求对跨域支持似乎不好，默认模式下的ajax成功跨域请求一旦改成了"application/json"就会报跨域请求的错