J2EE从入门到精通40-41-Ajax(2)

functionstartRequest(){ createXMLHttpRequest();

xmlHttp.onreadystatechange=handleStateChange; xmlHttp.open(\xmlHttp.send(null); }

functionhandleStateChange(){ if(xmlHttp.readyState==4){ if(xmlHttp.status==200){

document.getElementById(\xmlHttp.responseText; } } }

在这边为了简化范例，直接使用DOM对象的innerHTML属性，您可以按链结观看结果。

40.4发送请求参数

如果在请求时，要连带发送相关参数，若是使用GET的方式发送参数，则将参数附加在URL上即可，例如：

varurlAndqueryString=\xmlHttp.open(\xmlHttp.send(null);

如果发送请求时使用POST，那么将要发送的资料塞到send()中即可，例如： varurl=\

varqueryString=\xmlHttp.open(“POST\

xmlHttp.setRequestHeader(\xmlHttp.send(queryString);

由于塞到POST本体中的资料有可能是表单的name/value，也有可能是XML、JSON等格式，您必须告诉伺服端如何剖析表单本体内容，这可以设定Content-Type的header来告知，以name/value或JSON格式来说，就要设定Content-Type为application/x-www-form-urlencoded，如果是XML文件的话，则要设定text/xml。

以下以简单的实例示范如何以GET及POST发送请求参数，假设您用以下的Servlet来处理请求：

GetPostServlet.java

packageonlyfun.caterpillar; importjava.io.IOException; importjava.io.PrintWriter;

importjavax.servlet.ServletException;

importjavax.servlet.http.HttpServletRequest; importjavax.servlet.http.HttpServletResponse;

publicclassGetPostServletextendsjavax.servlet.http.HttpServletimplements

6

javax.servlet.Servlet{ publicGetPostServlet(){ super(); }

protectedvoiddoGet(HttpServletRequestrequest,

HttpServletResponseresponse)throwsServletException,IOException{ doResponse(request,response,\}

protectedvoiddoPost(HttpServletRequestrequest,

HttpServletResponseresponse)throwsServletException,IOException{ doResponse(request,response,\}

privatevoiddoResponse(HttpServletRequestrequest, HttpServletResponseresponse,Stringmethod) throwsServletException,IOException{

Stringname=request.getParameter(\response.setContentType(\PrintWriterout=response.getWriter(); out.println(method+\out.flush(); out.close(); } }

回应只是简单的传回发送的请求参数值，并加上GET或POST表示接收到何种请求，假设您使用以下的网页来发送请求：

GETPOSTEx-1.html

\

GET、POST

网页上分别有GET与POST两个按钮，按下后分别由GETPOSTEx-1.js中的doGetRequest()或doPostRequest()来发送GET、POST请求，假设GETPOSTEx-1.js撰写如下：

GETPOSTEx-1.js varxmlHttp;

7

functioncreateXMLHttpRequest(){ if(window.XMLHttpRequest){ xmlHttp=newXMLHttpRequest(); }

elseif(window.ActiveXObject){

xmlHttp=newActiveXObject(\} }

functioncreateQueryString(){//建立请求参数

return\取得文字方块值 }

functiondoGetRequest(){

varurl=\createXMLHttpRequest();

xmlHttp.onreadystatechange=handleStateChange; xmlHttp.open(\xmlHttp.send(null); }

functiondoPostRequest(){

varurl=\避免快取 createXMLHttpRequest();

xmlHttp.onreadystatechange=handleStateChange; xmlHttp.open(\

xmlHttp.setRequestHeader(\xmlHttp.send(createQueryString()); }

functionhandleStateChange(){ if(xmlHttp.readyState==4){ if(xmlHttp.status==200){

document.getElementById(\xmlHttp.responseText; } } }

由于POST时，网址URL并不会有所变化，在某些浏览器，如果请求的URL是相同的，则会利用快取中的资料，为了避免资料快取，则您可以故意加上一个timeStamp请求参数，附上当时系统的时间，如此每次请求时URL就不会相同。

完成以上程式后，在网页文字方块中输入\并按下GET按钮，则会传回\并显示在网页上，按下POST按钮，则会传回\并显示在网页上。

41.5XML传送与接收

Ajax客户端与服务端之间，可以使用XML作为资料传送、沟通的格式，Ajax客户端若要发送

8

XML，基本上就是将XML作为字串，塞在POST本体中发送，例如：

HandleXMLEx-1.js varxmlHttp;

functioncreateXMLHttpRequest(){ if(window.XMLHttpRequest){ xmlHttp=newXMLHttpRequest(); }

elseif(window.ActiveXObject){

xmlHttp=newActiveXObject(\} }

functionprepareXML(){ varxml=\

varoptions=document.getElementById(\for(vari=0;i

xml=xml+\} }

xml=xml+\returnxml; }

functionhandleSkills(){ varxml=prepareXML();

varurl=\createXMLHttpRequest();

xmlHttp.onreadystatechange=handleStateChange; xmlHttp.open(\

xmlHttp.setRequestHeader(\xmlHttp.send(xml); }

在上例中，将客户端于多选单中选择的资料，以下列的XML格式送出：

java vb csharp

而服务端接收到XML之后，针对XML加以分析，取得每个节点资料，如果使用Servlet作为服务器端，可以使用org.w3c.dom下所提供的DOM操作相关类别来剖析XML的内容，例如在以下的XMLServlet中，将取得的XML加以剖析，并以另一个XML文件重新发送回客户端。

XMLServlet.java

packageonlyfun.caterpillar; importjava.io.*;

importjavax.servlet.*; importjavax.servlet.http.*;

9

importjavax.xml.parsers.DocumentBuilder;

importjavax.xml.parsers.DocumentBuilderFactory; importjavax.xml.parsers.ParserConfigurationException; importorg.w3c.dom.Document; importorg.w3c.dom.NodeList; importorg.xml.sax.SAXException;

publicclassXMLServletextendsjavax.servlet.http.HttpServlet implementsjavax.servlet.Servlet{ protectedvoiddoPost(

HttpServletRequestrequest,HttpServletResponseresponse) throwsServletException,IOException{

Stringxml=readXMLFromRequestBody(request); DocumentxmlDoc=null; try{

DocumentBuilderbuilder=

DocumentBuilderFactory.newInstance().newDocumentBuilder(); xmlDoc=builder.parse(

newByteArrayInputStream(xml.getBytes())); }

catch(ParserConfigurationExceptione){ System.out.println(e); }

catch(SAXExceptione){ System.out.println(e); }

StringresponseXML=prepareXMLResponse(xmlDoc);

responseXML=responseXML+\response.setContentType(\response.getWriter().print(responseXML); }

privateStringreadXMLFromRequestBody(HttpServletRequestrequest){ StringBufferxml=newStringBuffer(); try{

BufferedReaderreader=request.getReader(); Stringline=null;

while((line=reader.readLine())!=null){ xml.append(line); } }

catch(Exceptione){

System.out.println(\读取有误…\

10