Recientemente, estoy leyendo el libro <<Ajax en acción>>. Utilicé el conocimiento del libro y lo combiné con .net para escribir este artículo sobre el uso de .net para procesar xmlHttp para enviar solicitudes asincrónicas.
Lo que queremos lograr es hacer clic en el botón para obtener la hora actual del servidor. El html de aspx es el siguiente:
HTML
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Linkedu.Web.WebWWW.Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transicional//ES" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml " >
<head runat="servidor">
<título>Prueba</título>
<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>
<lenguaje de escritura="javascript">
</script>
</cabeza>
<cuerpo>
<formulario id="form1" runat="servidor">
Obtenga la hora actual del servidor usando el método Post
<input id="btnTestPost" tipo="botón" valor="Publicar" />
Obtenga la hora actual del servidor usando el método Get
<input id="btnTestGet" tipo="botón" valor="Obtener" />
<div id="divResult"></div>
</formulario>
</cuerpo>
</html>
Para utilizar javascript para enviar solicitudes xmlHttp, el problema que debe resolverse es la compatibilidad con varios navegadores. Encapsulamos el envío de xmlHttp en un objeto javascript y al mismo tiempo solucionamos el problema de soporte entre navegadores en este objeto. El código es el siguiente:
objeto xmlHttp
/**//*
Objeto de carga de URL y una cola de solicitudes construida sobre él.
*/
/**//* objeto de espacio de nombres */
var net=nuevo objeto();
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;
/**//*--- objeto cargador de contenido para solicitudes entre navegadores ---*/
net.xmlHttp=función(url, onload, parámetros, método, contentType, onerror){
this.req=null;
this.onload=onload;
this.onerror=(onerror)? onerror: this.defaultError;
if(tipode(método) == "indefinido" || método == nulo)
{
método = "POST";
}
this.loadXMLDoc(url, parámetros, método, tipo de contenido);
}
net.xmlHttp.prototype.loadXMLDoc=función(url, parámetros, método, tipo de contenido){
si (!método){
método="OBTENER";
}
si (!contentType && método=="POST"){
contentType='aplicación/x-www-form-urlencoded';
}
si (ventana.XmlHttpRequest){
this.req=new XmlHttpRequest();
} si no (ventana.ActiveXObject){
this.req=new ActiveXObject("Microsoft.xmlHttp");
}
si (este.req){
intentar{
cargador var=esto;
this.req.onreadystatechange=función(){
net.xmlHttp.onReadyState.call(cargador);
}
this.req.open(método,url,verdadero);
si (tipo de contenido){
this.req.setRequestHeader('Tipo de contenido', tipo de contenido);
}
this.req.send(params);
}captura (errar){
this.onerror.call(esto);
}
}
}
net.xmlHttp.onReadyState=función(){
var req=this.req;
var listo=req.readyState;
si (listo==net.READY_STATE_COMPLETE){
var httpStatus=req.status;
si (httpEstado==200 || httpEstado==0){
this.onload.call(esto);
}demás{
this.onerror.call(esto);
}
}
}
net.xmlHttp.prototype.defaultError=función(){
alert("¡Error al obtener datos!"
+"nnreadyState:"+este.req.readyState
+"nstatus: "+este.solicitud.status
+"nheaders: "+this.req.getAllResponseHeaders());
}
Comencemos a escribir el código para enviar la solicitud xmlHttp:
default.js
//Objeto xmlHttp global
var cobj;
/**//* Inicio de publicación*/
// Vincular publicación para enviar el evento xmlHttp a btnTestPost
función cargarPruebaPost()
{
var iobj = document.getElementById("btnTestPost");
// Enlace para escuchar el botón btnTestPost
var clickRouter=new jsEvent.EventRouter(iobj,"onclick");
clickRouter.addListener(btnTestPostClick);
}
función btnTestPostClick()
{ // abrir parámetros url, onload, params, método, contentType, onerror
cobj = new net.xmlHttp("DefaultHandler.ashx",dealResult, "<T/>", "POST");
}
/**//* Fin de la publicación*/
/**//* Empezar*/
// Vincular Get para enviar el evento xmlHttp a btnTestGet
función cargarPruebaGet()
{
var iobj = document.getElementById("btnTestGet");
// enlace de escucha del botón btnTestGet
var clickRouter=new jsEvent.EventRouter(iobj,"onclick");
clickRouter.addListener(btnTestGetClick);
}
función btnTestGetClick()
{ // abrir parámetros url, onload, params, método, contentType, onerror
cobj = new net.xmlHttp("DefaultHandler.ashx?T=1",dealResult, null, "GET");
}
/**//* Obtener fin*/
función acuerdoResultado()
{
var dobj = document.getElementById("divResult");
dobj.innerHTML = cobj.req.responseXML.text;
}
ventana.onload = función()
{
// Vincular publicación para enviar el evento xmlHttp a btnTestPost
cargarPruebaPost();
// Vincular Get para enviar el evento xmlHttp a btnTestGet
cargarPruebaGet();
};
El último es el código para procesar .net xmlHttp.
.net maneja solicitudes xmlHttp
clase pública DefaultHandler: IHttpHandler
{
XmlDocument protegido _xmlResult;
ProcessRequest público vacío (contexto HttpContext)
{
si (context.Request["T"]! = nulo)
{//OBTENER prueba xmlhttp
contexto.Response.ContentType = "texto/xml";
XmlDocument xmlDoc = nuevo XmlDocument();
xmlDoc.LoadXml(string.Format(@"<time>GET:{0}</time>", System.DateTime.Now));
xmlDoc.Save(context.Response.OutputStream);
contexto.Respuesta.End();
}
demás
{//POST prueba xmlhttp
contexto.Response.ContentType = "texto/xml";
XmlDocument xmlDoc = nuevo XmlDocument();
xmlDoc.Load(context.Request.InputStream);
si (xmlDoc.DocumentElement.Name == "T")
{
xmlDoc.LoadXml(string.Format(@"<time>POST:{0}</time>", System.DateTime.Now));
xmlDoc.Save(context.Response.OutputStream);
contexto.Respuesta.End();
}
}
}
bool público EsReutilizable
{
conseguir
{
devolver falso;
}
}
}
http://www.cnblogs.com/laiwen/archive/2006/12/26/604050.html