教授跟我学JSON相关技术及在项目中的应用示例——在JavaScript程序中向Web服务器端程序发送JSON对象字符串的应用示例
杨教授工作室精心创作的优秀程序员职业提升必读系列资料
1. 1 跟我学JSON相关技术及在项目中的应用示例——在JavaScript程序中向Web服务器端程序发送JSON对象字符串的应用示例
1. 1. 1在客户端JS程序中向服务器端程序发送JSON对象字符串
下面的示例实现在Web客户端的JavaScript程序中向Web服务器端相关的程序发送JSON对象字符串然后在服务器端的相关程序中将JSON对象字符串转换为Java中的对象从而获得客户端程序发送的对象数据。
1、设计示例中的页面sendJSo nStringToServlet.jsp
1在项目的WebRoot目录下新建一个文件名称为s endJSonStringToServlet.jsp页面
2 sendJSonStringToServlet.jsp页面的代码示例
<%@page pageEncoding="gb2312"%>
<!DOCTYPE HTMLPUBLIC"-//W3C//DTD HTML4.01 Transitional//EN">
<ht ml>
<head>
<script type="text/javascript" language="javascript"
杨教授工作室版权所有1 盗版必究 1/13页
杨教授工作室精心创作的优秀程序员职业提升必读系列资料
src="${pageCo ntext.request.contextPath}/javascript/json2.js">
/**
引用JSON系统库中的parse函数所在的系统库文件json2.j s
*/
</script>
<script type="text/javascript" language="javascript">var xmlHttpRequest;function sendRequestToServlet(requestURL,actionType){xmlHttpRequest=createXMLHttpRequest();switc h(ac tio nTyp e){case 4:xmlHttp Req ue s t.o nread ysta tec ha nge=getServletResponseResult_ReturnObjectArray;var js onAllPers ons Object={"AllPers ons":[
{"name":"张三","sex":"m","age":"40"},{},{"na me":" 王 五","sex":"m","age":"27"} ]
};var allPersonsArray=jsonAllPersonsObject.AllPersons;var o neJSonObje cString=JSON.s tringify(allPe rs onsArray);requestURL=requestURL+"&oneJS onObjecStringN ame="+o neJSonObjecString;b re ak;case 5:xmlHttp Req ue s t.o nread ysta tec ha nge=getServletResponseResult_StringArray;b re ak;
}xmlHttpReque st.open("GET",requestURL, true);xmlHttp Reque st.se nd(null);
杨教授工作室版权所有2 盗版必究 2/13页
杨教授工作室精心创作的优秀程序员职业提升必读系列资料
}function createXMLHttpReque st(){var localXMLHttpRequest;if(window.XMLHttpRequest){
/**
表示用户的浏览器为fireFox等非IE系列则应用XMLHttp Request对象模板创建出对象实例
*/localXMLHttpRequest=new XMLHttpRequest();
}else if(window.ActiveXObject){
/**
*表示用户的浏览器为IE系列则应用ActiveXObj ec t对象模板创建出对象实例
*/try{lo calXMLHttpRequest=new ActiveXObject("Msxml2.XMLHTTP");
}c atc h(e){try{localXMLHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");}c atc h(e){window.alert("你的IE浏览器不支持XMLHttpRequest相关的技术实现 ");}
}
}return localXMLHttpRequest;
}function getServletResponseRe sult_StringArray(){
杨教授工作室版权所有3 盗版必究 3/13页
杨教授工作室精心创作的优秀程序员职业提升必读系列资料
if(xmlH ttp Re q ue st.r e ad yS tate==4){if(xmlHttp Reque st.s tatus==200){var jsonAllS tringArrayFromServlet=
JS ON.parse(xmlHttpRequest.respo nse Te xt);var oneStringElement="";for(var loopIndex=0;loop Index<j sonAllStringArrayFromServlet.length;loop Index++){oneStringElement=oneS tringElement +jsonAllStringArrayF romServlet[loopIndex];
}document.getElementById("sho wRe sultOne").innerHTML=oneStringElement;}e lse if(xmlHttp Reque st.status==400){window.alert("你的请求无效 ");
}e lse if(xmlHttp Request.status==404){window.alert("你向服务端程序请求的URL不正确未找到请求的目标文件 ");}e lse if(xmlHttp Request.status==500){window.alert("服务器由于遇到错误而不能完成该请求 ");
}e lse if(xmlHttp Request.status==505){window.alert("HTTP版本不受支持 ");
}else{window.alert("出现了其它不知名的错误 ");
}
}
}function getServletResponseResult_ReturnObjectArray(){
杨教授工作室版权所有4 盗版必究 4/13页
杨教授工作室精心创作的优秀程序员职业提升必读系列资料
if(xmlH ttp Re q ue st.r e ad yS tate==4){if(xmlHttp Reque st.s tatus==200){var jsonAllP ersonsObj ectFromServlet=
JS ON.parse(xmlHttpRequest.respo nse Te xt);var onePersonString="";for(var loopIndex=0;loopIndex<j sonAllPersonsObjectFromServlet.length;loopIndex++){var onePersonObject=j sonAllPersonsObjectFromServlet[loopIndex];onePersonString=onePersonString+onePersonObject.name+" "+onePersonObject.sex+" "+onePersonObject.age+"<br>";}document.ge tEle mentById("sho wRe sultOne").innerHTML=o nePerso nString;}e lse if(xmlHttp Reque st.status==400){window.alert("你的请求无效 ");
}e lse if(xmlHttp Request.status==404){window.alert("你向服务端程序请求的URL不正确未找到请求的目标文件 ");}e lse if(xmlHttp Request.status==500){window.alert("服务器由于遇到错误而不能完成该请求 ");
}e lse if(xmlHttp Request.status==505){window.alert("HTTP版本不受支持 ");
}else{window.alert("出现了其它不知名的错误 ");
}
}
}
杨教授工作室版权所有5 盗版必究 5/13页
杨教授工作室精心创作的优秀程序员职业提升必读系列资料
</script>
<title>应用JSON实现在AJAX应用中客户/服务器之间交换数据</title>
</head>
<body>
<a href="#"onclick="sendRequestToServlet('${pageContext.request.contextPath}/doajaxResponseServlet?actionType=4',4)">
点击向服务器传送JavaScript对象的JSON对象字符串
</a><br/>
<a href="#"onclick="sendRequestToServlet('${pageContext.request.contextPath}/doajaxResponseServlet?actionType=5',5)">
点击获得服务器返回的JSON字符串数组字符串
</a><br/>
<div id="showResultO ne">
</d iv>
</body>
</ht ml>
3 sendJSonStringToServlet.jsp页面的最终结果
杨教授工作室版权所有6 盗版必究 6/13页
杨教授工作室精心创作的优秀程序员职业提升必读系列资料
2、在sendJSo nStringToServlet.jsp页面中引用json2.js文件
1在项目的WebRoot目录下的javascript子目录中包含有json2.js文件
2在sendJSonStringToServlet.jsp页面中引用json2.js文件
<script type="text/javascript" language="javascript"src="${pageCo ntext.request.contextPath}/javascript/json2.js">/**
引用JSON系统库中的parse函数所在的系统库文件json2.j s
杨教授工作室版权所有7 盗版必究 7/13页
杨教授工作室精心创作的优秀程序员职业提升必读系列资料
</script>
3、在Web项目中添加处理客户端请求的服务器端后台的DoAjaxRespons e Se rvlet程序代码
1 添加一个类名称为DoAjaxResponseServlet的J2EE Servlet程序程序包名称为com.bluedream.ajaxjsondemo.servlet
2设置向DoAjaxResponseServlet程序请求的URL-pattern为doajaxResponseServlet
杨教授工作室版权所有8 盗版必究 8/13页
杨教授工作室精心创作的优秀程序员职业提升必读系列资料
3编程DoAjaxResponseServlet程序的各个功能方法package com.bluedream.ajaxjsondemo.servlet;import java.io.IOException;import j ava.io.PrintWriter;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;public class DoAjaxResponseServletextends HttpServlet {public DoAjaxResponseServlet () {supe r();
}public void doGet(HttpServletRequest request,HttpServletResponse response)throws ServletException, IOException{re spo nse.se tC onte ntTyp e("te xt/html;c harse t=GBK");
PrintWriter o ut=respo nse.getWriter();
杨教授工作室版权所有9 盗版必究 9/13页
- 教授跟我学JSON相关技术及在项目中的应用示例——在JavaScript程序中向Web服务器端程序发送JSON对象字符串的应用示例相关文档
- 服务器Foxmail不能正常收发邮件解决办法(包括跟“服务器”“ssl”有关的各种错误提示)
- 收件【2017年整理】Foxmail不能正常收发邮件解决办法(包括跟“服务器”“ssl”有关的各种错误提示)
- 服务器采购3台HP服务器每台服务器加2块硬盘硬盘容量跟服务器的标配
- 单击windowsserver2003中配置打印机跟打印机服务器设置
- 对象跟我学JSON相关技术及在项目中的应用示例——应用JSon实现Web客户端和服务器端系统之间交换数据的应用示例
- 教授跟我学如何在MyEclipse开发工具中配置Tomcat服务器
ucloud香港服务器优惠活动：香港2核4G云服务器低至358元/年,968元/3年
ucloud香港服务器优惠降价活动开始了！此前，ucloud官方全球云大促活动的香港云服务器一度上涨至2核4G配置752元/年，2031元/3年。让很多想购买ucloud香港云服务器的新用户望而却步！不过，目前，ucloud官方下调了香港服务器价格，此前2核4G香港云服务器752元/年，现在降至358元/年，968元/3年，价格降了快一半了！UCloud活动路子和阿里云、腾讯云不同，活动一步到位，...
41云，服务器8折优惠券，200G TCP防御
41云怎么样?41云是国人主机品牌，目前经营产品有国内外云服务器、CDN(高防CDN)和物理机，其中国内外云服务器又细分小类有香港限流量VPS、香港大带宽VPS、香港弹性自选VPS、香港不限流VPS、香港BGP线路VPS、香港Cera+大带宽机器、美国超防VPS、韩国原生VPS、仁川原生VPS、日本CN2 VPS、枣庄高防VPS和金华高防VPS;物理机有美国Cera服务器、香港单程CN2服务器、香...
digital-vm$80/月，最高10GDigital-VM1Gbps带宽带宽
digital-vm在日本东京机房当前提供1Gbps带宽、2Gbps带宽、10Gbps带宽接入的独立服务器，每个月自带10T免费流量，一个独立IPv4。支持额外购买流量：20T-$30/月、50T-$150/月、100T-$270美元/月；也支持额外购买IPv4，/29-$5/月、/28-$13/月。独立从下单开始一般24小时内可以上架。官方网站：https://digital-vm.com/de...
-
namesgraphhttp://www.paper.edu.cn甘肃省政府采购支持ipad支持ipad重庆网通重庆联通网上营业厅手机版重庆网通重庆网通上网资费目前是多少? 小区宽带接入类型的eacceleratoraccess violation问题的解决办法!win10445端口WIN7怎么打开3306端口phpecho为什么在PHP中使用echo FALSE;什么也输出不了？应该如何输出FALSE？谢谢！