1. json的java实现,下载:http://www.json.org/java/index.html
2. json的javascript脚本,下载:http://www.json.org/js.html
配合使用客户端的JSON JavaScript脚本和服务器端的JSON Java实现,我们可以在客户端将JavaScript对象转换为JSON串发送到服务端,在服务端可以将Java对象转换为JSON串发送到客户端,从而简化数据的解析处理。
开发步骤:
1. 在WebRoot目录下新建json子目录,将json2.js复制到该目录下。
2. 将JSON的Java实现源文件连同所在的包一起复制到src目录下。
3. 编写jsonBook.jsp
4. 编写JsonBookServlet.java
JsonBookServlet.java:
public class JsonBookServlet extends HttpServlet {
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
doPost(req,resp);
}
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
String jsonStr=readJsonFromRequestBody(req);
System.out.print(jsonStr);
//保存请求数据的JSONArray对象
JSONArray jsonArray=null;
//用户选择的图书信息以JSONObject对象来表示
JSONObject jsonObject=null;
//用于保存响应数据的JSONAray对象
JSONArray jsonRespArray=new JSONArray();
try{
//以客户端发送的JSON串构造JSONAray对象
jsonArray=new JSONArray(jsonStr);
for(int i=0;i<jsonArray.length();i++){
jsonObject=jsonArray.getJSONObject(i);
int id=jsonObject.getInt("id");
Book book=BookManager.getBook(id);
jsonRespArray.put(new JSONObject(book));
}
}
catch(JSONException e){
e.printStackTrace();
}
resp.setContentType("text/json;charset=UTF-8");
PrintWriter out=resp.getWriter();
out.println(jsonRespArray.toString());
out.close();
}
/**
* 从请求体中读取客户端发送的JSON串
* @param request 请求对象
* @return String 类型,接收到的JSON串
*/
private String readJsonFromRequestBody(HttpServletRequest req){
StringBuffer jsonBuf=new StringBuffer();
char[] buf=new char[2048];
int len=-1;
try{
BufferedReader reader=req.getReader();
while((len=reader.read(buf))!=-1){
jsonBuf.append(new String(buf,0,len));
}
}
catch(IOException e){
e.printStackTrace();
}
return jsonBuf.toString();
}
}
jsonBook.jsp:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript" src="json/json2.js"></script>
<script type="text/javascript" src="js/commonBook.js"></script>
<script type="text/javascript" src="js/jsonBook.js"></script>
</head>
<body>
<form action="#">
<select id="books" size="5" multiple="multiple" onchange="sendBooks();">
<%
List books=BookManager.getBooks();
Iterator it=books.iterator();
while(it.hasNext()){
Book book=(Book)it.next();
%>
<option value="<%=book.getId() %>"><%=book.getTitle() %></option>
<% } %>
</select>
<span id="booksHeader"></span>
<table id="booksTable" border="0">
<tbody id="booksBody">
</tbody>
</table>
</form>
</body>
</html>
jsonBook.js:
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject)
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
else if(window.XMLHttpRequest)
xmlHttp=new XMLHttpRequest();
}
function createJson(){
var books=new Array();
var options=document.getElementById("books").options;
var option=null;
var j=0;
for(var i=0;i<options.length;i++){
option=options[i];
if(option.selected){
books[j]=new Book(option.value);
j++;
}
}
//将javascript 的数组转换为JSON串返回
return JSON.stringify(books);
}
function Book(id){
this.id=id;
}
//发送异步请求
function sendBooks(){
createXMLHttpRequest();
var jsonBook=createJson();
//这个文件是放在WebRoot下js目录,访问servlet时出现问题?
//var url="../jsonBookServlet?timeStamp="+new Date().getTime();
var url="/json-servlet/jsonBookServlet?timeStamp="+new Date().getTime(); //使用绝对路径
xmlHttp.open("POST",url,true);
xmlHttp.onreadystatechange=handleStateChange;
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlHttp.send(jsonBook);
}
//处理响应数据
function handleStateChange(){
if(xmlHttp.readyState==4){
if(xmlHttp.status==200){
clearPreviousResult();
parseResults();
}
}
}
//解析服务器响应的json串
function parseResults(){
//将服务器发回的JSON串转换为javascript中的数组
var bookArray=eval('('+xmlHttp.responseText+')');
if(bookArray.length>0){
createTableHeader();
}
for(var i=0;i<bookArray.length;i++){
addTableRow(bookArray[i]);
}
var booksHeader=document.createElement("h2");
var booksHeaderText=document.createTextNode("你所选择的图书详细信息: ");
booksHeader.appendChild(booksHeaderText);
document.getElementById("booksTable").setAttribute("border", "1");
}
运行前把json2.js的第一行注释掉,否则报错。