拼吾爱程序人生其他编程Ajax AJAX编程实践之与服务器通信

1  /  1  页   1 跳转 查看:1305

AJAX编程实践之与服务器通信

AJAX编程实践之与服务器通信

首先看下看下相对简单些的--向服务器发送一个包含有名/值对的简单查询串,在这种情况下XHP即可以用GET也可以用POST。

GET

function doRequestUsingGET() {
  createXMLHttpRequest();

  var queryString = " GetAndPostExample? " ;
  queryString = queryString + createQueryString()+ " &timeStamp= " + new Date().getTime();
  xmlHttp.onreadystatechange = handleStateChange;
  xmlHttp.open( " GET " , queryString, true );
  xmlHttp.send( null );
}

POST

function doRequestUsingPOST() {
  createXMLHttpRequest();

  var url = " GetAndPostExample?timeStamp= " + new Date().getTime();
  var queryString = createQueryString();

  xmlHttp.open( " POST " , url, true );
  xmlHttp.onreadystatechange = handleStateChange;
  xmlHttp.setRequestHeader( " Content-Type " , " application/x-www-form-urlencoded " );
  xmlHttp.send(queryString);
}

  queryString就是名/值对的参数形式了(如name=LiLin&age=23),在调用OPEN方法中,当请求方法是用POST的时候为了确保服务器知道请求体中有请求参数,需要调用setRequestHeader,将Content-Type值设置为application/x-www-form-urlencoded.当然也可不放在请求体中(那就不要用POST啦!)

  此时server处理:

import java.io. * ;
import java.net. * ;
import javax.servlet. * ;
import javax.servlet.http. * ;

public class GetAndPostExample extends HttpServlet {

  protected void processRequest(HttpServletRequest request, HttpServletResponse response, String method)
throws ServletException, IOException {

  // Set content type of the response to text/xml
  response.setContentType( " text/xml " );

  // Get the user's input
  String firstName = request.getParameter( " firstName " );
  String middleName = request.getParameter( " middleName " );
  String birthday = request.getParameter( " birthday " );

  // Create the response text
  String resp + firstName + " " + middleName
+ " . Your birthday is " + birthday + " . "
+ " [Method: " + method + " ] " ;

  // Write the response back to the browser
  PrintWriter out = response.getWriter();
  out.println(responseText);

  // Close the writer
  out.close();
  }

  protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
  // Process the request in method processRequest
  processRequest(request, response, " GET " );
  }

  protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
  // Process the request in method processRequest
  processRequest(request, response, " POST " );
  }
}

  对get and post方法都用processRequest来处理。

  要向服务器发送相关复杂的查询串,可以将模型变化为XML发送到server 。

  client端:

function createXML() {
  var xml = " <pets> " ;

  var options = document.getElementById( " petTypes " ).childNodes;
  var option = null ;
  for ( var i = 0 ; i < options.length; i ++ ) {
  option = options;
  if (option.selected) {
  xml = xml + " <type> " + option.value + " <\/type> " ;
  }
  }

  xml = xml + " <\/pets> " ;
  return xml;
}

function sendPetTypes() {
  createXMLHttpRequest();

  var xml = createXML();
  var url = " PostingXMLExample?timeStamp= " + new Date().getTime();

  xmlHttp.open( " POST " , url, true );
  xmlHttp.onreadystatechange = handleStateChange;
  xmlHttp.setRequestHeader( " Content-Type " , " application/x-www-form-urlencoded " );
  xmlHttp.send(xml);
}

  createXML方法无非就是将内容以DOM的样式存到var xml(变量)里。有时也可能出现client直接将本地的一个XML文件直接以DOM(当然可以edit)的样式传送.(也放这个时个的Content-Type应该为text/xml了!)这时可能要用到ActiveXObject("MSXML2.DOMDocument.3.0")这样一个控件了。

 感谢原创者的辛勤劳动,希望对您有所帮助,转载请注明原出处。
 您可能对 [Ajax] 的这些文章也感兴趣:

面向Java程序员的Ajax:构建动态Java程序  在ASP.NET 2.0 AJAX中调用Webservice
VS 2008中ASP.NET AJAX的新应用程序服务:Role Application Service  AJAX开发简略 (第一部分)
AJAX应用解决一些常见问题  10分钟图解ASP.NET AJAX 1.0 RC开发
用 Ajax和 RSS制作一个首页新闻  ASP.NET的AJAX控件工具包已经更新
微软Ajax.SlideShowExtender控件使用详解  AJAX和J2EE创建功能强大的瘦客户端
利用AJAX与数据岛实现无刷新绑定  如何使用ajax开发web应用程序[1]
如何使用ajax开发web应用程序[2]  Web 2.0中AJAX技术应用详解
使用异步Servlet扩展AJAX应用程序  抢占AJAX制高点的战役白热化
理解Ajax及其工作原理,构建网站的一种有效方法  Ajax基础入门:Tags标记
AJAX框架汇总  Ajax与WCF交互
 

回复: AJAX编程实践之与服务器通信

关于这个控件有个方法可以在各broswer中通用的JS代码:

// --------------------------------------------------------------------
// Function: CreateXMLDOM
//
// Purpose: Creates a new XML DOM.
//
// Parameters: None
//
// Returns: XMLDOM object OR null
// --------------------------------------------------------------------
function CreateXmlDOM()
{
  var oXML = new ActiveXObject(GetXmlParserProgID());
  try
  {
  oXML.setProperty( " AllowXsltScript " , true );
  }
  catch (err) {}

  oXML.async = false ;
  oXML.validateOnParse = false ;
  oXML.resolveExternals = false ;
  oXML.setProperty( " SelectionLanguage " , " XPath " );
  try {oXML.setProperty( " NewParser " , true );} catch (e) {}

  return oXML;
}

// --------------------------------------------------------------------
// Function: GetXmlParserProgID
//
// Purpose:
// Gets the ProgID of the highest available version of the
// Microsoft XML parser.
//
// Parameters: None
//
// Returns: String (i.e. "Msxml2.DOMDocument.4.0")
//
// --------------------------------------------------------------------
function GetXmlParserProgID()
{
  var MAX_MAJOR_PARSER_VERSION = 10 ;
  var MIN_MAJOR_PARSER_VERSION = 0 ;
  var MAX_MINOR_PARSER_VERSION = 9 ;
  var MIN_MINOR_PARSER_VERSION = 0 ;

  var sProgID = g_sXmlParserProgID;
  var bFound = false ;

  if ( ! sProgID)
  {
  // Iterate through possible versions
  for ( var nMajor = MAX_MAJOR_PARSER_VERSION; nMajor >= MIN_MAJOR_PARSER_VERSION; nMajor -- )
  {
  for ( var nMinor = MAX_MINOR_PARSER_VERSION; nMinor >= MIN_MINOR_PARSER_VERSION; nMinor -- )
  {
  // Set up the classname for the version that we're trying to instantiate
  sProgID = " Msxml2.DOMDocument. " + nMajor + " . " + nMinor;

  try
  {
  if ( new ActiveXObject(sProgID))
  {
  bFound = true ;
  break ;
  }
  }
  catch (e)
  {}
  }

  if (bFound)
  {
  // store in a global variable to speedup subsequent calls
  g_sXmlParserProgID = sProgID;
  break ;
  }
  }
  }

  return sProgID;
}

  然后直接用其load方法(本地)。

var xmlDoc = new ActiveXObject( " MSXML2.DOMDocument.3.0 " );
xmlDoc.load(local_XML_FileName);

  当然也可以直接从server取来(用get方法即可),然后以responseText的方法

xmlht.Open( " GET " ,server_XML_FileName, true );
xmlht.onreadystatechange = stateChange;
xmlht.Send( null );

function handleStateChange() {
  if (xmlHttp.readyState == 4 ) {
  if (xmlHttp.status == 200 ) {
  xmlDoc.loadXML(xmlht.responseText);
  }
  }
}

  实际上xmlDoc.loadXML(xmlht.responseText)所得到的就是一个于内存中的DOM了,而直接用responseXML的话就直接可以解析为一个DOM了!(注意load(FILE)与loadXML(DOM)是不同的)

  此时servert process :

import java.io. * ;
import javax.servlet. * ;
import javax.servlet.http. * ;
import javax.xml.parsers.DocumentBuilderFactory;
import javax.xml.parsers.ParserConfigurationException;
import org.w3c.dom.Document;
import org.w3c.dom.NodeList;
import org.xml.sax.SAXException;

public class PostingXMLExample extends HttpServlet {

protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

String xml = readXMLFromRequestBody(request);
Document xmlDoc = null ;
try {
xmlDoc =
DocumentBuilderFactory.newInstance().newDocumentBuilder()
.parse( new ByteArrayInputStream(xml.getBytes()));
}
catch (ParserConfigurationException e) {
System.out.println( " ParserConfigurationException: " + e);
}
catch (SAXException e) {
System.out.println( " SAXException: " + e);
}

/**/ /* Note how the Java implementation of the W3C DOM has the same methods
* as the JavaScript implementation, such as getElementsByTagName and
* getNodeValue.
*/
NodeList selectedPetTypes = xmlDoc.getElementsByTagName( " type " );
String type = null ;
String resp ;
for ( int i = 0 ; i < selectedPetTypes.getLength(); i ++ ) {
type = selectedPetTypes.item(i).getFirstChild().getNodeValue();
responseText = responseText + " " + type;
}

response.setContentType( " text/xml " );
response.getWriter().print(responseText);
}

private String readXMLFromRequestBody(HttpServletRequest request) {
StringBuffer xml = new StringBuffer();
String line = null ;
try {
BufferedReader reader = request.getReader();
while ((line = reader.readLine()) != null ) {
xml.append(line);
}
}
catch (Exception e) {
System.out.println( " Error reading XML: " + e.toString());
}
return xml.toString();
}
}

  DOM,JDOM,JAXP随便你自己选好了!
网络核战不可避免!
 
1  /  1  页   1 跳转

快速回复帖子

标题
禁用 URL 识别
禁用表情
禁用 Discuz!NT 代码
使用个人签名
  [完成后可按 Ctrl+Enter 无刷新发布]  

版权所有 拼吾爱程序人生    在线留言

Powered by Discuz!NT 2.1.202   Copyright © 2001-2008 Comsenz Inc. 鄂ICP备07500843号
返顶部