ASP.NET WebForm也可以这样用Ajax(1)

作者:   出处:互联网   2015-07-06 10:22:44   阅读:2

对于asp.net WebForm项目,进行Ajax操作大概有三种方式:web服务(.asmx文件)  ,  一般处理程序(.ashx)和  一些Ajax控件。
 

对于.net提供的ajax控件,暂且不说,只说另外两种方式,都需要引入额外的代码文件对Ajax进行操作(asmx和ashx,且web服务还要引入一个cs文件与之对应),假如要对Example.aspx这个页面添加一些自定义的Ajax操作,并且这些Ajax操作并不会在别的页面上用到,如此不得不引入额外的代码文件完成这个操作,假如这个Ajax操作很简单,只需要一个简单的函数就可以执行,那岂不是很麻烦的过程吗?如此一来,随着项目中 Ajax操作的增多,ashx和asmx文件都会随着时间的增长而增长,项目的维护也会随之加倍。为什么们不能把Ajax操作的后台代码直接放在 Example.aspx对应的Example.aspx.cs文件里 ? 如果能这样做,以上两种烦恼都会迎刃而解,不是吗?


 

于是,按照以上思路,实现了如下Ajax框架。先来看这个框架的实现机制:


 


 

上图是自己画的一个缩减版IIS接收到一个aspx请求的HttpApplication管线和asp.net Page在执行ProcessRequest()方法中的页面生命周期的部分事件。Page本身是继承自IHttpHandler接口,IHttpHandler提供了一个重要的约束方法ProcessRequest,该方法是对接收到的信息(HttpContext)进行具体的处理同样,一般处理程序和web服务也实现了自己的IHttpHandler,并以此提供一些Ajax服务。具体的操作过程请自行查找MSDN。


 

原理是在页面生命周期开始的第一个事件PreInit进行一些处理,一旦发现劫持到的请求是一个ajax请求,那么利用C#的反射来调用aspx.cs中定义的方法,执行完方法之后,调用Response.End()方法,调用这个方法会直接跳到管线的EndRequest事件,从而结束请求,这样就无需走一些没有必要的页面生命周期的步骤,从而完成一个Ajax操作。如果发现是一个正常的操作,那么就走正常流程。


 

下面以一个简单例子说明该Ajax框架的使用:


 

1. 添加一个解决方案


 

2. 新建一个 Default.aspx 页面


 

3. 在Default.aspx.cs页面中创建一个被调用的测试方法:


 

public List string  TestAjaxMethod(int a, string b, float c)  {  return new List string  { a.ToString(), b, c.ToString() };  } 


 

4.      在Default.aspx中写一个Ajax请求


 

PowerAjax.AsyncAjax( TestAjaxMethod , [1, 2,  333 , sss ], function (SucceessResponse) {  // 成功后的代码  }); 


 

PowerAjax.js是用Jquery专门为这个框架封装的一个及其简单的JS类库,这个类库中有两个主要的方法:PowerAjax.AsyncAjax和PowerAjax.SyncAjax,一个提供同步操作,一个提供异步操作,参数有三个:


 

第一个参数是即将操作在aspx.cs的Ajax方法的名字(用名字反射方法)。


 

第二个参数是一个以数组形式组成参数列表数据。


 

第三个参数是操作成功之后执行执行的回调方法,与c#中的委托一个道理。


 

以下为这个简单JS库的代码:


 

var PowerAjax = function () { }  PowerAjax.__Private = function () { }    // 进行异步操作  PowerAjax.AsyncAjax = function (methodName, paramArray, success) {  PowerAjax.__Private.Ajax(methodName, paramArray, success, true);  }    // 进行的是同步操作  PowerAjax.SyncAjax = function (methodName, paramArray, success) {  PowerAjax.__Private.Ajax(methodName, paramArray, success, false);  }    PowerAjax.__Private.Ajax = function (methodName, paramArray, success, isAsync) {  var data = {};  switch (paramArray.length) {  case 0:  data = { 'isAjaxRequest': true, 'MethodName': methodName };  break;  case 1:  data = { 'isAjaxRequest': true, 'MethodName': methodName,  param0 : paramArray[0] };  break;  case 2:  data = { 'isAjaxRequest': true, 'MethodName': methodName,  param0 : paramArray[0],  param1 : paramArray[1] };  break;  case 3:  data = { 'isAjaxRequest': true, 'MethodName': methodName,  param0 : paramArray[0],  param1 : paramArray[1],  param2 : paramArray[2] };  break;  case 4:  data = { 'isAjaxRequest': true, 'MethodName': methodName,  param0 : paramArray[0],  param1 : paramArray[1],  param2 : paramArray[2],  param3 : paramArray[3] };  break;  case 5:  data = { 'isAjaxRequest': true, 'MethodName': methodName,  param0 : paramArray[0],  param1 : paramArray[1],  param2 : paramArray[2],  param3 : paramArray[3],  param4 : paramArray[4] };  break;  }    var url = document.location.href;  $.ajax({  type:  post ,  url: url,  data: data,  async: isAsync,  datatype:  json ,  contentType:  application/x-www-form-urlencoded; charset=UTF-8 ,  success: function (response) {  success(response);  },  error: function (response) {  if (response.status == 500) {  var errorMessage = response.responseText;  var errorTitle = errorMessage.substring(errorMessage.indexOf( title ) + 7, errorMessage.indexOf( /title ))  throw new Error( 服务器内部错误:  + errorTitle);  }  }  });  } 


 

5. 更改Default.aspx.cs的继承页面为AjaxBasePage 


 

public partial class _Default : AjaxBasePage 
Copyright© 2006-2015 ComponentCN.com all rights reserved.重庆磐岩科技有限公司(控件中国网) 版权所有 渝ICP备12000264号 法律顾问:元炳律师事务所
客服软件
live chat