servlet整合ajax接受和返回json数据
1.准备工作和前提条件
- ide工具使用的是eclipse(自我感觉eclipse建普通的servlet的项目比idea简洁轻便)
- 使用tomcat版本是7
- 使用的servlet是2.5(建议使用这个版本,是xml配置版本)
- 在lib包下引入lombok依赖,build path到项目中
- 在lib包下引入jackson相关的依赖,java和json对象互转需要使用
- jackson-annotations-2.4.0.jar
- jackson-core-2.4.2.jar
- jackson-databind-2.4.2.jar
2.测试的pojo类
package com.shaoming.pojo;
import java.util.Date;
import com.fasterxml.jackson.annotation.JsonFormat;
import com.fasterxml.jackson.annotation.JsonProperty;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.experimental.Accessors;
/**
*
* @author Admin
*
*/
@Data
@AllArgsConstructor
@NoArgsConstructor
@Accessors(chain=true)
public class Employ {
@JsonProperty(value = "empid")
private Integer id;
@JsonProperty(value = "empjob")
private String job;
@JsonProperty(value = "empname")
private String name;
@JsonProperty(value = "salary")
private Double salary;
@JsonProperty(value = "生日")
/**
* 具体输出格式,自己调整 pattern
* timezone="GMT+8 表示北京时间
* (1)hh表示表示12小时制的时间
* @JsonFormat(pattern = "yyyy-MM-dd hh:mm:ss",timezone="GMT+8")
* (2)HH表示24小时制度的时间
* @JsonFormat(pattern = "yyyy-MM-dd hh:mm:ss",timezone="GMT+8")
*/
//@JsonFormat(pattern = "yyyy-MM-dd hh:mm:ss",timezone="GMT+8") //12小时制时间
//@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss",timezone="GMT+8") //24小时制时间
//@JsonFormat(pattern = "yyyyMMdd")
@JsonFormat(pattern = "yyyyMMdd HHmmss",timezone="GMT+8")
private Date birthday;
//@JsonProperty(value = "strdate")
/**
* 说明:@JsonForat对字符串属性值不起作用,要在sql语句中进行设置
*/
//@JsonFormat(pattern = "yyyyMMdd HHmmss")
private String strdate;
}
说明:
@JsonFormat(pattern = “yyyyMMdd HHmmss”,timezone=“GMT+8”)
private Date birthday;
作用:格式化返回数据的时间格式
@JsonProperty(value = “empid”)
private Integer id;作用:指定返回数据id的名字是empid,不叫这个注解,返回的json数据id的名字就是id
3.java对象转json格式字符窜的工具类
使用的是jackson里面的ObjectMapper工具类
MyUtil.java
package com.shaoming.util;
import org.apache.tomcat.util.http.mapper.Mapper;
import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
/**
* jackson相关的工具类
* @author Admin
*
*/
public class MyUtils {
private static ObjectMapper mapper = null;
static {
mapper = new ObjectMapper();
}
public static String toJson(Object obj) throws JsonProcessingException {
String json = mapper.writeValueAsString(obj);
return json;
}
}
4.写servlet接受请求
servlet的模板
public class XxxServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//>>处理POST请求参数乱码
request.setCharacterEncoding("utf-8");
//>>处理响应正文乱码
response.setContentType("text/html;charset=utf-8");
//TODO...
response.setContentType("application/json");
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doGet(request, response);
}
}
编写AjaxServlet模板
package com.shaoming.servlet;
import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStreamReader;
import java.io.PrintWriter;
import java.util.Date;
import javax.servlet.ServletException;
import javax.servlet.ServletInputStream;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.shaoming.pojo.Employ;
import com.shaoming.util.MyUtils;
/**
*
*/
public class AjaxServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
//private static final String String = null;
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//>>处理POST请求参数乱码
request.setCharacterEncoding("utf-8");
//>>处理响应正文乱码
response.setContentType("text/html;charset=utf-8");
//TODO...
response.setContentType("application/json");
/**
* 使用Jackson的objectMapper()这个工具类
*/
// ObjectMapper mapper = new ObjectMapper();
Employ employ = new Employ();
employ.setBirthday(new Date()).setId(33333).setJob("工作").setName("姓名").setSalary(100.0).setStrdate("20202020");
/**
* 直接返回的就是一个java对象的数据在页面上
* 数据类容如下:
* Employ(id=1, job=工作, name=姓名, salary=100.0, birthday=Sat Jun 20 03:30:39 CST 2020, strdate=20202020)
*/
/**
* 1.返回json数据到页面上
* 数据类容如下:
* {"id":1,"job":"工作","name":"姓名","salary":100.0,"birthday":1592595578774,"strdate":"20202020"}
*/
String json = MyUtils.toJson(employ);
System.out.println("json数据打印到控制台上,内容如下 \n");
System.out.println(json);
/**
* 输出到页面上
*/
PrintWriter out = response.getWriter();
//out.write(json);
out.print(json);
//out.print(employ);
System.out.println("**************************");
/**
* 测试ajax请求
* 接受json
*/
BufferedReader reader = new BufferedReader(new InputStreamReader(request.getInputStream(), "utf-8"));
String temp = null;
String jsondata = "";
while ((temp = reader.readLine()) != null) {
jsondata += temp;
}
reader.close();
System.out.println(jsondata);
ObjectMapper mapper = new ObjectMapper();
//e就是返回的json数据,对应jsp页面的empObjeJson
//把拿到的json数据转换为java对象
Employ e = mapper.readValue(jsondata, Employ.class);
System.out.println(e);
//把java对象在转换为json本的的格式
java.lang.String json2 = MyUtils.toJson(e);
System.out.println(json2);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doGet(request, response);
}
}
说明:
这个是获取到发送过来的json格式的字符窜,用ObjectMapper类转成java对象,就可以在java里面使用了
BufferedReader reader = new BufferedReader(new InputStreamReader(request.getInputStream(), “utf-8”));
String temp = null;
String jsondata = “”;
while ((temp = reader.readLine()) != null) {
jsondata += temp;
}
reader.close();
System.out.println(jsondata);
编写ajax请求的jsp页面
index.jsp
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=utf8"
pageEncoding="utf8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf8">
<title>测试ajax和servlet之间的请求响应</title>
<!-- 引入jQuery -->
<script src="jquery-1.8.3.min.js"></script>
</head>
<body>
<button id="btn1">我是一个测试按钮</button>
<button id="btn2">我是一个测试跨域按钮</button>
<a href="http://localhost:8080/page_oracl/hello/totestajax">超链接测试跨域</a>
<script>
$("#btn1").click(function() {
funajax();
});
function funajax() {
alert("下面发送ajax请求");
//模拟一个json数据给servlet接受
var empObj = {
strdate : "20202020",
empid : 1000,
empjob : "工作",
empname : "姓名",
salary : 102.11,
生日 : "20200620 141635"
};
var empjson = {
"strdate" : "20202023",
"empid" : 222,
"empjob" : "工作",
"empname" : "姓名",
"salary" : 100.0,
"生日" : "20200620 140716"
};
//alert(typeof (empObj));//object类型
//alert(typeof (empjson));//object类型
//alert(typeof (JSON.stringify(empObj)));//string类型
//alert(typeof (JSON.stringify(empjson)));//string类型
$.ajax({
url : "http://localhost:8080/java-web/AjaxServlet",
//说明:无论时get和post,HttpServlet都是可以接受的
/**
如果传递json数据必须时post
*/
type : "post",
data : JSON.stringify(empjson),
contentType:"application/json;charset=utf-8",//发送给后台数据的格式
async : true,//表示异步请求
dataType : "json",
success : function(result) {
console.log(result);
},
error : function() {
alert("ajax请求失败");
}
});
}
</script>
</script>
</body>
</html>
说明:
js中js对象和json格式字符串之间的互相转换
1.js对象转json格式的字符窜
JSON.parse(str)
2.json格式的字符串转json对象
JSON.stringify(empjson)
js和json格式字符串互相转换的案例
F12后在chorm的console控制台上的测试案例
var emp = {id:18,name:"name的值"}
undefined
var empjson = JSON.stringify(emp);
undefined
console.log(empjson);
VM1831:1 {"id":18,"name":"name的值"}
undefined
var empjsobj = JSON.parse(empjson);
undefined
console.log(empjsobj);
VM2000:1 {id: 18, name: "name的值"}
undefined