扫一扫
分享文章到微信
扫一扫
关注官方公众号
至顶头条
     最近正在拜读<<Ajax in Action>>这本书,运用书中知识,结合.net,写了这篇用.net 处理xmlHttp发送异步请求的文章。 
   
  我们要达到的目的是点击按钮,获得服务器的当前时间,aspx的html如下: 
  Html 
  <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Linkedu.Web.WebWWW.Default" %> 
   
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
   
  <html xmlns="http://www.w3.org/1999/xhtml" > 
  <head runat="server"> 
   <title>测试</title> 
   <script language="javascript" src="javascript/prototype/extras-array.js"></script> 
   <script language="javascript" src="javascript/xmlHttp.js"></script> 
   <script language="javascript" src="javascript/eventRouter.js"></script> 
   <script language="javascript" src="Default.js"></script> 
   <script language="javascript"> 
   
   </script> 
  </head> 
  <body> 
   <form id="form1" runat="server"> 
   用Post方式获得服务器的当前时间 
   <input id="btnTestPost" type="button" value="Post" /> 
   用Get方式获得服务器的当前时间 
   <input id="btnTestGet" type="button" value="Get" /> 
   <div id="divResult"></div> 
  </form> 
  </body> 
  </html> 
   
  要用javascript 发送xmlHttp 请求必须解决的问题是跨浏览器的支持。我们把xmlHttp的发送封装在一个javascript对象中,同时在这个对象中解决了跨浏览器支持的问题。代码如下: 
   
  xmlHttp对象 
  /**//* 
  url-loading object and a request queue built on top of it 
  */ 
   
  /**//* namespacing object */ 
  var net=new Object(); 
   
  net.READY_STATE_UNINITIALIZED=0; 
  net.READY_STATE_LOADING=1; 
  net.READY_STATE_LOADED=2; 
  net.READY_STATE_INTERACTIVE=3; 
  net.READY_STATE_COMPLETE=4; 
   
   
  /**//*--- content loader object for cross-browser requests ---*/ 
  net.xmlHttp=function(url, onload, params, method, contentType, onerror){ 
   this.req=null; 
   this.onload=onload; 
   this.onerror=(onerror) ? onerror : this.defaultError; 
   if(typeof(method) == "undefined" || method == null) 
   { 
   method = "POST"; 
   } 
   this.loadXMLDoc(url, params, method, contentType); 
  } 
   
  net.xmlHttp.prototype.loadXMLDoc=function(url, params, method, contentType){ 
   if (!method){ 
   method="GET"; 
   } 
   if (!contentType && method=="POST"){ 
   contentType='application/x-www-form-urlencoded'; 
   } 
   if (window.XmlHttpRequest){ 
   this.req=new XmlHttpRequest(); 
   } else if (window.ActiveXObject){ 
   this.req=new ActiveXObject("Microsoft.xmlHttp"); 
   } 
   if (this.req){ 
   try{ 
   var loader=this; 
   this.req.onreadystatechange=function(){ 
   net.xmlHttp.onReadyState.call(loader); 
   } 
   this.req.open(method,url,true); 
   if (contentType){ 
   this.req.setRequestHeader('Content-Type', contentType); 
   } 
   this.req.send(params); 
   }catch (err){ 
   this.onerror.call(this); 
   } 
   } 
  } 
   
   
  net.xmlHttp.onReadyState=function(){ 
   var req=this.req; 
   var ready=req.readyState; 
   if (ready==net.READY_STATE_COMPLETE){ 
   var httpStatus=req.status; 
   if (httpStatus==200 || httpStatus==0){ 
   this.onload.call(this); 
   }else{ 
   this.onerror.call(this); 
   } 
   } 
  } 
   
  net.xmlHttp.prototype.defaultError=function(){ 
   alert("error fetching data!" 
   +"\n\nreadyState:"+this.req.readyState 
   +"\nstatus: "+this.req.status 
   +"\nheaders: "+this.req.getAllResponseHeaders()); 
  } 
  下面开始写发送xmlHttp请求的代码: 
   
  default.js 
  //全局xmlHttp对象 
  var cobj; 
   
  /**//* Post begin*/ 
  //绑定Post发送xmlHttp事件到btnTestPost 
  function loadTestPost() 
  { 
   var iobj = document.getElementById("btnTestPost"); 
   //btnTestPost按钮监听的绑定 
   var clickRouter=new jsEvent.EventRouter(iobj,"onclick"); 
   clickRouter.addListener(btnTestPostClick); 
  } 
  function btnTestPostClick() 
  { // open参数 url, onload, params, method, contentType, onerror 
   cobj = new net.xmlHttp("DefaultHandler.ashx",dealResult, "<T/>", "POST"); 
  } 
  /**//* Post end*/ 
   
   
  /**//* Get begin*/ 
  //绑定Get发送xmlHttp事件到btnTestGet 
  function loadTestGet() 
  { 
   var iobj = document.getElementById("btnTestGet"); 
   //btnTestGet按钮监听的绑定 
   var clickRouter=new jsEvent.EventRouter(iobj,"onclick"); 
   clickRouter.addListener(btnTestGetClick); 
  } 
  function btnTestGetClick() 
  { // open参数 url, onload, params, method, contentType, onerror 
   cobj = new net.xmlHttp("DefaultHandler.ashx?T=1",dealResult, null, "GET"); 
  } 
  /**//* Get end*/ 
   
   
   
  function dealResult() 
  { 
   var dobj = document.getElementById("divResult"); 
   dobj.innerHTML = cobj.req.responseXML.text; 
  } 
   
   
  window.onload = function() 
  { 
   //绑定Post发送xmlHttp事件到btnTestPost 
   loadTestPost(); 
   //绑定Get发送xmlHttp事件到btnTestGet 
   loadTestGet(); 
  }; 
   
  最后是.net处理xmlHttp的代码 
  .net 处理xmlHttp请求 
  public class DefaultHandler : IHttpHandler 
   { 
   protected XmlDocument _xmlResult; 
   
   public void ProcessRequest(HttpContext context) 
   { 
   if (context.Request["T"] != null) 
   {//GET xmlhttp测试 
   context.Response.ContentType = "text/xml"; 
   XmlDocument xmlDoc = new XmlDocument(); 
   xmlDoc.LoadXml(string.Format(@"<time>GET:{0}</time>", System.DateTime.Now)); 
   xmlDoc.Save(context.Response.OutputStream); 
   context.Response.End(); 
   } 
   else 
   {//POST xmlhttp测试 
   context.Response.ContentType = "text/xml"; 
   XmlDocument xmlDoc = new XmlDocument(); 
   xmlDoc.Load(context.Request.InputStream); 
   if (xmlDoc.DocumentElement.Name == "T") 
   { 
   xmlDoc.LoadXml(string.Format(@"<time>POST:{0}</time>", System.DateTime.Now)); 
   xmlDoc.Save(context.Response.OutputStream); 
   context.Response.End(); 
   } 
   } 
   } 
   
   public bool IsReusable 
   { 
   get 
   { 
   return false; 
   } 
   } 
   } 
   
  http://www.cnblogs.com/Files/laiwen/XmlHttpNet.rar 
  http://www.cnblogs.com/laiwen/archive/2006/12/26/604050.html 
如果您非常迫切的想了解IT领域最新产品与技术信息,那么订阅至顶网技术邮件将是您的最佳途径之一。