前端代码:
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>入门程序</title>
<script src="js/jquery-3.4.1.min.js"></script> <!--引入jquery-->
<script>
//页面加载,绑定单击事件
$(function(){
$("#btn").click(function(){
//alert("hello btn");
//发送ajax请求
$.ajax({
url:"user/testAjax",
contentType:"application/json;charset=UTF-8",//MIME类型
data:'{"username":"chpllp", "password":"1234", "age":30}',
dataType:"json", //返回类型
type:"post",
success:function(data){
//data服务器端响应的json数据,进行解析
alert(data);
alert(data.username);
alert(data.password);
alert(data.age);
}
})
});
});
</script>
</head>
<button id="btn">发送ajax的请求</button>
</body>
</html>
后端代码:
@RequestMapping("/testAjax")
public @ResponseBody User testAjax(@RequestBody User user){
System.out.println("testAjax.....");
//客户端发送ajax的请求,传的是json字符串,后端把json字符串封装到user对象中(需要引入jackson的jar包)
System.out.println(user);
//模拟查询数据库
user.setUsername("haha");
user.setAge(40);
//做响应
return user;
}
@ResponseBody的作用其实是将java对象转为json格式的数据。
@responseBody注解的作用是将controller的方法返回的对象通过适当的转换器转换为指定的格式之后,写入到response对象的body区,通常用来返回JSON数据或者是XML数据。
注意:在使用此注解之后不会再走视图处理器,而是直接将数据写入到输入流中,他的效果等同于通过response对象输出指定格式的数据。
@ResponseBody是作用在方法上的,@ResponseBody 表示该方法的返回结果直接写入 HTTP response body 中,一般在异步获取数据时使用【也就是AJAX】。
注意:在使用 @RequestMapping后,返回值通常解析为跳转路径,但是加上 @ResponseBody 后返回结果不会被解析为跳转路径,而是直接写入 HTTP response body 中。 比如异步获取 json 数据,加上 @ResponseBody 后,会直接返回 json 数据
pom文件需要引入的坐标:
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.9.0</version>
</dependency>
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-core</artifactId>
<version>2.9.0</version>
</dependency>
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-annotations</artifactId>
<version>2.9.0</version>
</dependency>