11.JSON数据交互和RESTful支持
11.1JSON数据交互
11.1.1 JSON概述
JSON(JavaScript Object Notation, JS 对象标记)是一种轻量级的数据交换格式。与 XML 一样,JSON 也是基于纯文本的数据格式。它有对象结构和数组结构两种数据结构。
1)对象结构
对象结构以“{”开始、以“}”结束,中间部分由 0 个或多个以英文“,”分隔的 key/value 对构成,key 和 value 之间以英文“:”分隔。对象结构的语法结构如下:
{
key1:value1,
key2:value2,
...
}
其中,key 必须为 String 类型,value 可以是 String、Number、Object、Array 等数据类型。例如,一个 person 对象包含姓名、密码、年龄等信息,使用 JSON 的表示形式如下:
{
"pname":"张三",
"password":"123456",
"page":40
}
2)数组结构
数组结构以“[”开始、以“]”结束,中间部分由 0 个或多个以英文“,”分隔的值的列表组成。数组结构的语法结构如下:
{
value1,
value2,
...
}
上述两种(对象、数组)数据结构也可以分别组合构成更加复杂的数据结构。例如,一个 student 对象包含 sno、sname、hobby 和 college 对象,其 JSON 的表示形式如下:
{
"sno":"201802228888",
"sname":"张三",
"hobby":["篮球","足球"],
"college":{
"cname":"清华大学",
"city":"北京"
}
}
11.1.2 JSON数据转换
为实现浏览器与控制器类之间的 JSON 数据交互,Spring MVC 提供了 MappingJackson2HttpMessageConverter 实现类默认处理 JSON 格式请求响应。该实现类利用 Jackson 开源包读写 JSON 数据,将 Java 对象转换为 JSON 对象和 XML 文档,同时也可以将 JSON 对象和 XML 文档转换为 Java 对象。
在使用注解开发时需要用到两个重要的 JSON 格式转换注解,分别是 @RequestBody 和 @ResponseBody。
- @RequestBody:用于将请求体中的数据绑定到方法的形参中,该注解应用在方法的形参上。
- @ResponseBody:用于直接返回return 对象,该注解应用在方法上。
11.1.3 样例展示
修改springmvc配置文件,配置静态资源的访问映射
<!-- 配置注解驱动 -->
<mvc:annotation-driven />
<!--配置静态资源的访问映射,此配置中的文件,将不被前端控制器拦截 -->
<mvc:resources location="/js/" mapping="/js/**" />
编写前端测试JSON数据交互的页面
<head>
<title>测试JSON交互</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript"
src="${pageContext.request.contextPath }/js/jquery-1.11.3.min.js">
</script>
<script type="text/javascript">
function testJson(){
// 获取输入的用户名和密码
var username = $("#username").val();
var password = $("#password").val();
$.ajax({
url : "${pageContext.request.contextPath }/testJson",
type : "post",
// data表示发送的数据
data :JSON.stringify({username:username,password:password}),
// 定义发送请求的数据格式为JSON字符串
contentType : "application/json;charset=UTF-8",
//定义回调响应的数据格式为JSON字符串,该属性可以省略
dataType : "json",
//成功响应的结果
success : function(data){
if(data != null){
alert("您输入的用户名为:"+data.username+
"密码为:"+data.password);
}
}
});
}
</script>
</head>
<body>
<form>
用户名:<input type="text" name="username" id="username"><br />
密 码:
<input type="password" name="password" id="password"><br />
<input type="button" value="测试JSON交互" onclick=" testJson()" />
</form>
</body>
编写控制器类
@Controller
public class UserController {
@RequestMapping("/testJson")
@ResponseBody
public User testJson(@RequestBody User user){
System.out.print(user);
return user;
}
}
测试访问
11.2RESTfu数据交互
11.2.1 RESTfu概述
可以理解为一种软件架构风格或者设计风格。
简单来说,就是把请求参数变成请求路径
原先的 :.../queryItem?id=1
变换后:.../item/1
11.2.2 RESTfu数据转换
编写控制器类请求方法
/**
*接收RESTful风格的请求,其接收方式为GET
*/
@RequestMapping(value="/user/{id}",method=RequestMethod.GET)
@ResponseBody
public User selectUser(@PathVariable("id") String id){
//查看数据接收
System.out.println("id="+id);
User user=new User();
//模拟根据id查询出到用户对象数据
if(id.equals("1234")){
user.setUsername("tom");
}
//返回JSON格式的数据
return user;
}
value="/user/{id}"表示匹配以/user/{id}结尾的请求,id为动态参数
method=RequestMethod.GET表示请求方式
@PathVariable("id")将请求URL中的变量映射到方法的形参上。
然后编写前端界面
<head>
<title>RESTful测试</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript"
src="${pageContext.request.contextPath }/js/jquery-1.11.3.min.js">
</script>
<script type="text/javascript">
function search(){
// 获取输入的查询编号
var id = $("#number").val();
$.ajax({
url : "${pageContext.request.contextPath }/user/"+id,
type : "GET",
//定义回调响应的数据格式为JSON字符串,该属性可以省略
dataType : "json",
//成功响应的结果
success : function(data){
if(data.username != null){
alert("您查询的用户是:"+data.username);
}else{
alert("没有找到id为:"+id+"的用户!");
}
}
});
}
</script>
</head>
<body>
<form>
编号:<input type="text" name="number" id="number">
<input type="button" value="搜索" onclick="search()" />
</form>
</body>
测试运行结果如下: