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

2024-07-10 13:08:35

字体：大中小

来源：转载

供稿：网友

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