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