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

最新推荐文章于 2024-08-20 10:59:31 发布

sep229

最新推荐文章于 2024-08-20 10:59:31 发布

阅读量577

点赞数 1

文章标签： .net javascript function xmlhttprequest object url

最近正在拜读《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.οnlοad=onload; 

this.οnerrοr=(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

sep229

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
用.Net处理xmlHttp发送异步请求

最近正在拜读《Ajax in Action》这本书，运用书中知识，结合.net，写了这篇用.net 处理xmlHttp发送异步请求的文章。我们要达到的目的是点击按钮，获得服务器的当前时间，aspx的html如下： Html Inherits="Linkedu.Web.WebWWW.Defa
复制链接

扫一扫