WEB开发网
开发学院WEB开发ASP.NET 用.net 处理xmlHttp发送异步请求 阅读

用.net 处理xmlHttp发送异步请求

 2006-12-27 17:19:03 来源:WEB开发网   
核心提示:最近正在拜读<<Ajax in Action>>这本书,运用书中知识,用.net 处理xmlHttp发送异步请求,结合.net,写了这篇用.net 处理xmlHttp发送异步请求的文章,aspx的html如下:Html<%@ Page Language="C#" Aut

最近正在拜读<<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

Tags:net 处理 xmlHttp

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接