寂寞部屋
- 关注互联网,关注生活
关注互联网,关注生活
2019年五月
« 4月    
 12345
6789101112
13141516171819
20212223242526
2728293031  
  • 日志总数:553 篇
  • 浏览总量:2,435,457 次
  • 运行天数:619 天
  • 建站时间:2017-9-14
  • 最后更新:2019-4-2

详解如何实现最基本的AJAX框架

环境:Window Xp sp2 + .Net FramwWork 2.0.50727。

Asp.Net 2.0自带的客户端回调

Asp.Net 2.0已经发布。2.0有了许多新特性,客户端回调就是其中之一。客户端回调允许我们不经过回发而调用服务器端的方法,与AJAX提供的功能是一致的,但是不如AJAX灵活,AJAX可以自定义调用的方法,2.0自带的回调功能却不行。要使用客户端回调功能必须实现System.Web.UI.IcallbackEventHandler接口。
这个接口包含两个方法:

//客户端回调时固定调用此方法

public void RaiseCallbackEvent(String eventArgument)

//执行完RaiseCallbackEvent后将调用此方法。此方法的返回值将被发回客户端

public string GetCallbackResult()

例一:

C#代码
  1. String cbReference = Page.ClientScript.GetCallbackEventReference(this"arg""ReceiveServerData""context");   
  2.   
  3.         String callbackScript;   
  4.   
  5.         callbackScript = "function CallServer(arg, context)" + "{ " + cbReference + "} ;";   
  6.   
  7.         Page.ClientScript.RegisterClientScriptBlock(   
  8.         this.GetType(), "CallServer", callbackScript, true);  

javascript:

 

AJAX介绍
AJAX并不是一种新的技术,而是一些已有技术的有机结合,主要包括:XmlHttp、Reflect。一个AJAX框架基本上包括:一个自定义的HttpHandler、一段JavaScript代码。

AJAX运行机制
以前我们使用XmlHttp实现无刷新页面的时候,是用XmlHttp来请求一个隐藏的页面,使用(Asp/Asp.Net)自带的HttpHandler,而在AJAX中,我们请求的也是一个隐藏的页面,不同的是这个页面的HttpHandler是由我们自己来实现。

打造自己的AJAX

1.首先我们要实现一个Http处理程序(HttpHandler)来响应客户端的请求:
实现自定义的HttpHandler需要实现IHttpHandler接口。
该接口包含一个属性和一个方法:

bool IHttpHandler.IsReusable
void IHttpHandler.ProcessRequest(HttpContext context)
Example:

JavaScript代码
  1. bool IHttpHandler.IsReusable   
  2.   
  3. {   
  4.   
  5.   get { return true; }   
  6.   
  7. }   
  8.   
  9. void IHttpHandler.ProcessRequest(HttpContext context)   
  10.   
  11. {   
  12.   
  13.   context.Response.Clear(); //获取要调用的方法   
  14.   
  15.   string methodName = context.Request.QueryString["me"];   
  16.   
  17.   //获取程序集信息。   
  18.   
  19.   //Czhenq.AJAX.Class1.Dencode是自定义的字符串编码方法   
  20.   
  21.   string AssemblyName = Czhenq.AJAX.Class1.Dencode(context.Request.QueryString["as"]);    
  22. //获取方法的参数    
  23.   
  24.   string Arguments = context.Request.QueryString["ar"]; //开始调用方法   
  25.   
  26.   Type type = Type.GetType(AssemblyName);   
  27.   
  28.   MethodInfo method = type.GetMethod(methodName,    
  29. BindingFlags.NonPublic | BindingFlags.Public | BindingFlags.Static | BindingFlags.Instance);    
  30.   
  31.   if (method != null)    
  32.   
  33.   {   
  34.   
  35. //参数使用","分隔   
  36.   
  37. string[] args = Arguments.Split(",".ToCharArray());   
  38.   
  39. ParameterInfo[] paras = method.GetParameters();    
  40.   
  41. object[] argument = new object[paras.Length];   
  42.   
  43. for (int i = 0; i < argument.Length; i++)   
  44.   
  45. {   
  46.   
  47.   if (i < args.Length) {    
  48.   
  49. //因为XmlHttp传递过来的参数全部时String类型,所以必须进行转换   
  50.   
  51. //这里只将参数转换为Int32,并不做其他考虑。    
  52.   
  53. argument[i] = Convert.ToInt32(args[i]);   
  54.   
  55.   }   
  56.   
  57. }   
  58.   
  59. object value = method.Invoke(Activator.CreateInstance(type, true), argument);   
  60.   
  61. if (value != null) context.Response.Write(value.ToString());   
  62.   
  63. else context.Response.Write("error");    
  64.   
  65.   }   
  66.   
  67.   //处理结束    
  68.   context.Response.End();   
  69. }   

2.客户端Javascript代码:

JavaScript代码
  1. function CallMethod(AssemblyName,MethodName,Argus)   
  2. {   
  3.   var args = "";    
  4.   for(var i=0;i   
  5. args += Argus[i] + ",";   
  6.   
  7. if(args.length>0) args = args.substr(0,args.length-1);   
  8. var xmlhttp = new ActiveXObject(‘Microsoft.XMLHTTP’);    
  9. url = "AJAX/AJAX.czhenq?as=" + AssemblyName + "&me=" + MethodName +"&ar="+ args;    
  10. xmlhttp.open("POST",url,false);   
  11. xmlhttp.send();   
  12. alert(xmlhttp.responseText);   
  13. }  

3.一个简单的AJAX框架已经实现。现在写段代码来测试.
使用自己的AJAX

1.新建一个网站,并应用刚才你编写的HttpHandler。并在网站的Web.config中注册你的HttpHandler,说明那些请求将使用你编写的Handler来处理。下面的内容说明:所有以"czq"结尾的请求,都将使用"Czhenq.HttpHandlerFactory"来处理。
                  type="Czhenq.HttpHandlerFactory, Czhenq.AJAX"/>

2.添加一个web页面,将刚才的脚本拷贝到页面中,并添加一个你要调用的方法。

JavaScript代码
  1. private string Add(int i, int j)   
  2. {   
  3.   return TextBox1.Text;   
  4. }   

3.在页面中放置一个HiddenField控件,命名为AssemblyName。
并在Page_Load中添加如下代码:

C#代码
  1. string assemblyName = Czhenq.AJAX.Class1.Encode(typeof(_Default).AssemblyQualifiedName);   
  2. AssemblyName.Value = assemblyName;  

4.页面中添加如下脚本: 

JavaScript代码
  1. var assemblyName = document.getElementById("AssemblyName");   
  2.   
  3. var argus = new Array();   
  4.   
  5. argus.push("100");   
  6.   
  7. argus.push("200");   
  8.   
  9. CallMethod(assemblyName, "Add", argus);  

总结
AJAX并不是一种新的技术,它只是一些已有技术的有机结合,我们可以将AJAX简单的理解为:AjAx是对JavaScript调用XmlHttp的封装,它改变的是代码书写方式。
Encode 与 Dencode实现:

C#代码
  1. public static string Encode(string value)   
  2. {   
  3.     byte[] bytes = ASCIIEncoding.ASCII.GetBytes(value);   
  4.     return Convert.ToBase64String(bytes);   
  5. }   
  6. public static string Dencode(string value)   
  7. {   
  8.     byte[] bytes = Convert.FromBase64String(value);   
  9.     return ASCIIEncoding.ASCII.GetString(bytes);   
  10. }  

作者:sharmy

本站原创文章,请勿复制转载
版权声明:除特别注明外,本站所有文章均为原创,未经许可请勿复制、转载
2007-11-10
2,181 views
标签: , , ,
暂无评论

发表评论

注意: 评论者允许使用'@user空格'的方式将自己的评论通知另外评论者。例如, ABC是本文的评论者之一,则使用'@ABC '(不包括单引号)将会自动将您的评论发送给ABC。使用'@all ',将会将评论发送给之前所有其它评论者。请务必注意user必须和评论者名相匹配(大小写一致)。