异步请求技术的实现除了jquery ajax,还有flash,applet,iframe等。
但ajax对流媒体的支持没有flash,applet要好。另外ajax对手持设备的支持不是很好。
ajax的工作原理
ajax的核心是XmlHttpRequest。1.创建XmlHttpRequest核心对象。
var xhr=new XmlHttpRequet()2.注册回调函数,监听服务器的状态
xhr.onreadystatechange=function{ if(xhr.readyState==4){ if(xhr.status==200||xhr.state.status==304){ //开始处理信息 xhr.responseText() } } }
当服务器的readyState值为4时,说明已经请求已经结束了,服务器可以进行响应了。
3.客户端与服务端建立连接
xhr.open(method,url,async)
method:get或post方式
url:请求的路径
async:是否异步(默认true)
4.设置请求头(post请求才需要设置)
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");5.客户端向服务器发送请求
xhr.send(data)如果是get请求,则不会向服务器发送任何数据。需要手动设置:
xhr.send(null)
服务器响应的数据格式
可以是文本格式,xml或者json。文本格式用的较少,通常是xml或json格式。1.文本格式
XMLHttpRequest对象的responseText属性
2.XML格式
如果响应数据格式为XML的话,需设置响应的首部信息:"Content-Type"为"text/xml"。
注意:如果不设置首部信息,客户端接收并不会报错,但是接收值为空。
3.json格式
json被存储在responseText属性中
可以使用XMLHttpRequest对象的responseText属性。
json格式分为类map格式和类数组格式。
其他格式转为XML和JSON格式
将List,Array,Map格式转化为XML格式:XStream
将List,Array,Map格式转化为JSON格式:Json-lib
将List,Array,Map格式转化为JSON格式:Json-lib
JSONUtils.java
import java.util.List; import java.util.Map; import net.sf.json.JSONArray; import net.sf.json.JSONObject; import net.sf.json.JsonConfig; import net.sf.json.util.CycleDetectionStrategy; import net.sf.json.xml.XMLSerializer; /** * 处理json数据格式的工具类 * * @author lp * @version 1.0 */ public class JsonUtil { /** * 将数组转换成String类型的JSON数据格式 * * @param objects * @return */ public static String array2json(Object[] objects){ JSONArray jsonArray = JSONArray.fromObject(objects); return jsonArray.toString(); } /** * 将list集合转换成String类型的JSON数据格式 * * @param list * @return */ public static String list2json(List list){ JSONArray jsonArray = JSONArray.fromObject(list); return jsonArray.toString(); } /** * 将map集合转换成String类型的JSON数据格式 * * @param map * @return */ public static String map2json(Map map){ JSONObject jsonObject = JSONObject.fromObject(map); return jsonObject.toString(); } /** * 将Object对象转换成String类型的JSON数据格式 * * @param object * @return */ public static String object2json(Object object){ JSONObject jsonObject = JSONObject.fromObject(object); return jsonObject.toString(); } /** * 将XML数据格式转换成String类型的JSON数据格式 * * @param xml * @return */ public static String xml2json(String xml){ JSONArray jsonArray = (JSONArray) new XMLSerializer().read(xml); return jsonArray.toString(); } /** * 除去不想生成的字段(特别适合去掉级联的对象) * * @param excludes * @return */ public static JsonConfig configJson(String[] excludes) { JsonConfig jsonConfig = new JsonConfig(); jsonConfig.setExcludes(excludes); jsonConfig.setIgnoreDefaultExcludes(true); jsonConfig.setCycleDetectionStrategy(CycleDetectionStrategy.LENIENT); return jsonConfig; } }
eval()函数
eval():将js对象转化为json对象
xhr.onreadystatechange = function(){ if(xhr.readyState==4){ if(xhr.status==200){ var data = xhr.responseText; /* * eval()函数:JSON格式的转换 * 如果向eval()函数,传递一对空的大括号"{}" * * 利用"()"将其包装,eval()函数会强行将其转换成JSON数据格式 * * 不用"()"将其包装,eval()函数会将其解析为一个空的语句块 */ var json = eval("("+data+")"); alert(data); } } }
IE将XmlHttpRequest实现为一个Active对象 其他浏览器则实现为本地的js对象