前言
上一篇介绍了在webform平台实现ajax的一些方式,并且实现一个基类。这一篇我们来看一个开源的组件:ajaxpro。虽然这是一个比较老的组件,不过实现思想和源码还是值得我们学习的。通过上一篇的介绍,我们知道要调用页面对象的方法,就是靠反射来实现的,关键是整个处理过程,包括反射调用方法、参数映射等。ajaxpro不仅在后台帮我们实现了这个过程,在前台也封装了请求调用的方法,例如ajax的相关方法,用ajaxpro的方法就可以发送异步请求了,不需要自己封装js或者使用js库。接下来就对这个组件进行浅析。
一、ajaxpro的使用
我们先来看这个组件如何使用。
1. 注册AjaxHandlerFactory
在web.config里进行如下配置:
1 2 3 | <httpHandlers>
<add verb= "POST,GET" path= "ajaxpro/*.ashx" type= "AjaxPro.AjaxHandlerFactory, AjaxPro" /> </httpHandlers> |
简单的说,请求的url符合 ajaxpro/*.ashx 格式的,都会被AjaxHandlerFactory处理,这是一个实现IHandlerFactory接口的工厂类,用来获取IHandler处理程序。其中type的格式是:"名称控件.类名称,程序集名称"。
2. 在页面类Page_Load事件进行注册
1 2 3 4 | protected void Page_Load( object sender, EventArgs e) {
AjaxPro.Utility.RegisterTypeForAjax( typeof (AjaxProPage)); } |
我们传递了本页面对象的Type给ResisterTypoForAjax方法,这个方法用来在前台注册脚本,具体会调用当前Page对象的RegisterClientScriptBlock进行注册,所以.aspx文件中必须有一个<form runat="server"></form>,否则脚本将无法注册。(这里传递了Type,实际也可以做到不用传递的,内部通过HttpContext.Current.Handler.GetType().BaseType 也可以获得这个类型)
3.用AjaxMethod标记方法
1 2 3 4 5 | [AjaxMethod] public List< string > GetList( string input1, string input2) {
return new List< string > { input1, input2 }; } |
AjaxMethod是一个标记属性,表示这个方法用于处理ajax请求,它最终通过反射执行;它有几个构造函数对,对于有些需要缓存的数据,可以设置缓存时间;如果我们的请求不需要使用Session,可以设置HttpSessionStateRequirement;如果请求需要异步,例如请求一个耗时的web服务,也可以设置处理程序为异步状态。
方法的返回值可以是简单的类型,也可以是复杂的类型;例如集合类型在前台获得就是一个数组。
4.前台调用
后台的配置和使用都非常简单,接下来我们看前台如何发起请求。
1 2 3 4 5 6 7 | function GetList() {
//var result = AjaxProNamespace.AjaxProPage.GetList("a", "b").value;
//console.log(result);
AjaxProNamespace.AjaxProPage.GetList( "a" , "b" , function (result) {
console.log(result);
}); } |
这里AjaxProNamespace 是页面类所在的名称空间,AjaxProPage 就是页面类的名称,GetList是标记的方法。为什么可以这样写呢?前面说到,ajaxpro会在前台注册脚本,它会根据我们页面对象的相关信息生成如下脚本,所以我们才可以这样调用,而完全不用自己写js或者用jquery库的方法。
1 2 3 4 5 6 7 8 9 10 | if ( typeof AjaxProNamespace == "undefined" ) AjaxProNamespace={}; if ( typeof AjaxProNamespace.AjaxProPage_class == "undefined" ) AjaxProNamespace.AjaxProPage_class={}; AjaxProNamespace.AjaxProPage_class = function() {}; Object.extend(AjaxProNamespace.AjaxProPage_class.prototype, Object.extend( new AjaxPro.AjaxClass(), {
GetList: function(input1, input2) {
return this .invoke( "GetList" , { "input1" :input1, "input2" :input2}, this .GetList.getArguments().slice(2));
},
url: ‘/ajaxpro/AjaxProNamespace.AjaxProPage,TestAjaxProSourceCode.ashx‘ })); AjaxProNamespace.AjaxProPage = new AjaxProNamespace.AjaxProPage_class(); |
GetList的参数对应后台方法的参数,类型必须可以转换,否则调用会失败。最后一个参数为回调函数,回调函数的参数是对返回结果进行封装的对象,其value属性就是执行成功返回的值,如上面返回的就是一个数组对象。其error包括了失败的信息。
注意,上面注释掉的部分是同步请求的做法,这往往不是我们想要的,我曾经就见过有人这样错误的使用。
二、ajaxpro处理请求原理
这里主要关注组件处理ajax请求的过程,其它辅助功能不做介绍。
1.生成辅助脚本
在Page_Load事件里我们调用了AjaxPro.Utility.RegisterTypeForAjax(typeof(AjaxProPage)); 用来注册所需要的脚本。我们注意到在前台页面引入了如下脚本:
也就是每个页面都会都会发起这几个Get 请求。这几个都是.ashx结尾的文件,但实际里面都是js代码;这些js有的是作为资源嵌套在dll内部,有的是自动生成的,主要是封装了ajax请求相关方法,以及让我们可以用:名称空间.页面类名称.标记方法名称这样去调用方法。为什么要用.ashx而不是用.js呢?因为作为组件内部的资源文件,外部无法直接请求.js文件,而.ashx可以被拦截,然后用Response.Write将内容输出。
如果每次都生成和发送这些脚本的效率是很低的,ajaxpro内部的处理是判断请求头的If-None-Math和If-Modified-Since,如果两个都和缓存的一样,就返回一个304状态码。所以,客户端只有首次请求服务端会返回文件的内容,后续的都只返回304表示使用本地缓存。我们刷新页面可以验证这个过程:
我们知道304状态码表示服务端告诉浏览器可以使用本地缓存,它的具体过程是这样的:浏览器将发送请求,Request包括If-None-Math和If-Modified-Since;服务端接收到请求后,判断If-None-Math和ETag是否一样,判断If-Modified-Since和请求内容的Last-Modified-Time是否一样;如果都一样,则返回304状态码,浏览器接收到304,就直接使用本地缓存;如果有一个不一样,服务端都将输出具体内容,此时Response包含新的ETag和Last-Modified-Time。这个过程最明显的好处就是服务端不需要发送内容给浏览器,但缺点就是浏览器和服务端还需要一次请求-响应的过程。个人认为这里可以使用Cache-Control,并设置一个较大值的时间,因为这里的js文件内容基本是不会变化的。Cache-Control表示浏览器请求时,先判断请求是否过时,如果没有过时,则直接从本地缓存获得,这个过程浏览器不需要和服务端建立任何请求;如果过时,浏览器才会发起请求。(需要注意的是,浏览器缓存都是基于Get请求的,Post请求是不会被缓存的)
2. 拦截请求
HttpHandler(IHttpHandler) 和 HttpModule(IHttpModule) 是asp.net 两个重要的组件,让我们可以在asp.net的基础上很方便的进行扩展。HttpHandler对应某种具体的请求,例如.ashx,.aspx等;HttpModule是一个拦截器,可以在管道的某个事件对所有请求进行拦截。简单的说,在管道中,HttpApplication会触发一系列事件,我们在通过HttpModule对某个事件进行注册,例如我们可以在处理程序对象生成前拦截请求,然后映射到自己的处理程序;而实际处理请求返回结果的是HttpHandler,例如Page用来生成html。
以asp.net mvc框架为例,它是建立在asp.net 路由机制的基础上的,asp.net 路由系统通过一个UrlRoutingModule对请求进行拦截,具体是在PostResolveRequestCache事件进行拦截,对url进行解析,封装相应的路由数据后,最终将请求交给一个MvcHandler进行处理,MvcHandler实现了IHttpHandler接口。
前面我们进行了如下配置:<add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro"/> 这表明了任何的以ajaxpro/任意名称.ashx结尾的 Post/Get 请求,都交给AjaxPro.AjaxHandlerFactory进行处理,它是一个实现了IHandlerFactory的处理程序工厂,用来生成具体的IHttpHandler。组件内部定义了多个实现IHttpHandler的类,有的是为了生成js脚本的,对于处理ajax请求,主要分为两类:异步(IHttpAsyncHandler)和非异步(IHttpHandler);在这两类的基础上,对于Session的状态的支持又分为三种:支持读写(实现IRequiresSessionState标记接口)的Handler、只读(实现IReadOnlySessionState标记接口)的Handler和不支持Session的Handler。具体生成什么样的Handler是通过AjaxMethod进行判断的。
IHttpHandler的ProcessRequest(异步就是BeginProcessRequest)就用来执行请求返回输出结果的。如果只需要一种处理程序我们也可以实现IHttpHandler。IHandlerFactory的定义如下:
1 2 3 4 5 | public interface IHttpHandlerFactory {
IHttpHandler GetHandler(HttpContext context, string requestType, string url, string pathTranslated);
void ReleaseHandler(IHttpHandler handler); } |
所以,ajaxpro的所有请求都会符合ajaxpro/*.ashx格式,然后在GetHandler方法,就可以进行具体的处理,返回结果是IHttpHandler;以非异步状态为例,如果我们配置了需要Session,就会生成一个实现IHttpHandler和IRequiresSessionState的Handler,如果需要只读的Session,就会生成一个实现IHttpHandler和IReadOnlySessionState的Handler;这些信息可以通过反射从AjaxMethod标记属性获得。AjaxHandlerFactory的主要代码如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 | public IHttpHandler GetHandler(HttpContext context, string requestType, string url, string pathTranslated) {
string filename = Path.GetFileNameWithoutExtension(context.Request.Path);
Type t = null ;
Exception typeException = null ;
bool isInTypesList = false ;
switch (requestType)
{
//Get请求,获取前面的那4个脚本
case "GET" :
switch (filename.ToLower())
{
case "prototype" :
return new EmbeddedJavaScriptHandler( "prototype" );
case "core" :
return new EmbeddedJavaScriptHandler( "core" );
case "ms" :
return new EmbeddedJavaScriptHandler( "ms" );
case "prototype-core" :
case "core-prototype" :
return new EmbeddedJavaScriptHandler( "prototype,core" );
case "converter" :
return new ConverterJavaScriptHandler();
default :
return new TypeJavaScriptHandler(t);
}
case "POST" :
IAjaxProcessor[] p = new IAjaxProcessor[2];
p[0] = new XmlHttpRequestProcessor(context, t);
p[1] = new IFrameProcessor(context, t);
for ( int i = 0; i < p.Length; i++)
{
if (p[i].CanHandleRequest)
{
//获取标记方法的AjaxMethod属性
AjaxMethodAttribute[] ma = (AjaxMethodAttribute[])p[i].AjaxMethod.GetCustomAttributes( typeof (AjaxMethodAttribute), true );
bool useAsync = false ;
HttpSessionStateRequirement sessionReq = HttpSessionStateRequirement.ReadWrite;
if (ma.Length > 0)
{
useAsync = ma[0].UseAsyncProcessing;
if (ma[0].RequireSessionState != HttpSessionStateRequirement.UseDefault)
sessionReq = ma[0].RequireSessionState;
}
//6种Handler,根据是否异步,session状态返回指定的Handler
switch (sessionReq)
{ 知识推荐
我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8
不良信息举报平台
互联网安全管理备案
Copyright 2023 www.wodecom.cn All Rights Reserved |