当前位置: 首页 > 图文教程 > 网络编程 > ASP.NET > 用.net 处理xmlHttp发送异步请求

ASP.NET
asp.net css注释的影响
ASP.NET与数据库相关技巧
关于HtmlForm控件
三色交替的下拉列表框
精通ASP.NET中弹出窗口技术
ASP.NET Forums与现有系统整合方案示例
ASP.NET操作IIS中的虚拟目录
DataGrid与SQL Server 2000数据绑定
如何让Web应用程序在Client端实现导出报表功能
如何保证web app中的Send Email线程稳定性
关于用ASP.Net识别远程主机服务器种类
ASP.NET中上传下载文件
提高ASP.NET性能的方法
asp.net StreamReader 创建文件
asp.net如何生成图片验证码(简单)
一个.net 压缩位图至JPEG的代码
简单的SQL Server数据库数据读取与数据操作
获取网站的RSS聚合到自己的网页
.Net程序中整站通用的防SQL注入函数
asp.net生成缩略图及给原始图加水印的函数

ASP.NET 中的 用.net 处理xmlHttp发送异步请求


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-23   浏览: 166 ::
收藏到网摘: n/a

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