java向前端传json和前端对json的解析应用
目录
java向前端传json和前端对json的解析应用
java向前端传json和前端对json的解析应用
后台向前台发送json
可以手动拼写也可以利用jar包完成这里用fastjson
在pom.xml加入
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.43</version>
</dependency>
后台代码
@RequestMapping("json")
public String json(HttpServletResponse reponse,Model model,HttpServletRequest request) {
User user = new User();
user.setName("cuichongdong");
user.setAge(26);
user.setId(1);
System.out.println(JSON.toJSON(user));
//下面第一种方式用model,
model.addAttribute("user",JSON.toJSON(user));
//下面的是HttpServletRequest 和Model哪一种都行 2选一
//request.setAttribute("user", JSON.toJSON(user));
return "sys/user/list2";//这是Spring框架 将要跳转的页面
}
这里可以看到打印台上面的json字符串
html显示后来发过来的json字符串(jstl及EL表达式方式)
js方式
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%request.setAttribute("webPath", request.getContextPath());%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="${webPath}/resources/js/jquery-1.7.1.min.js" ></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>list</title>
</head>
<script type="text/javascript">
var str='${user}';
var obj = eval ('(' + str + ')');
alert(obj.name);
</script>
<body>
<h1>${user}</h1>
<h1>${user.name}</h1>
<h1>${user.age}</h1>
<h1>${user.id}</h1>
</body>
</html>
成功展示