Ajax.net用户指南(转)

来源:http://club.techtarget.com.cn/blog/viewBlog.html?blogId=1903

Ajax.net用户指南

程守华 译

概述

AJAX依靠服务器作为中介来散发及处理要。为了好这项工作,.net封装类依赖让客户端的请对象,而xmlHttpRequest对象吃多数的浏览器扶助,因而下此目标是一个没错的解决方案。因为包装的目标是隐藏xmlHttpRequest的贯彻,故我们无探讨他的兑现细节。

封装类是因此在.net的计齐搭AJAX属性标记来实现的,一旦受记,AJAX创造客户端的javascript函数(这类于客户端编写的javascript函数),并动用xmlhttprequest成立服务器代理,这多少个代理映射客户端的函数到服务器的处理函数。

复杂呢?不晤面的,让我们看下面的简练例子,给有之.net 函数

 

‘VB.Net
public function Add(firstNumber as integer, secondNumber as integer) as integer
  return firstNumber + secondNumber
end sub

 

//C#
public int Add(int firstNumber, int secondNumber)
{
   return firstNumber + secondNumber;
}

Ajax.net会就自行的始建带有六只参数、名字呢Add的javascript函数,当客户端调用这javascript函数时,请求将起后台送至劳动器端并于拿计结果再次来到给客户端。

 

开班安装

我们先是由安拿”.dll”安装及公的路起头,当然,假若您打探咋样利用,这无异节可以过了。

要是您还一向不Ajax.dll,可以率先下载AJAX的潮流版本。解压文件放到可以于公的品种援的地点,在.net项目被,添加上对那几个的援,然后就是好开下ajax.dll封装举行开了。

 

如果你在安装引用时遇到了麻烦,可以参考这个链接的说明:

 

设置HttpHandle

为要该得以干活,第一步要召开的凡当web.config中设置设置封装包的HttpHandle,不错过详细表明HttpHandle是安工作之,我们一味需要领悟她们得以用来拍卖asp.net请求。例如,所有的目标也*.aspx的央求能够透过System.Web.UI.PageHandlerFactory类发送至控制句柄,简单的游说,我们把其他向ajax/\.ashx的要发送到*Ajax.PageHandlerFactory的请处理句柄:

<configuration>
  <system.web>
    <httpHandlers>
      <add verb="POST,GET" path="ajax/*.ashx"
           type="Ajax.PageHandlerFactory, Ajax" />
    </httpHandlers> 
    …
  <system.web>
</configuration>

下边的代码告诉asp.net把任何匹配到特定的路子(ajax/\.ashx)请求发送至Ajax.PageHandlerFactory发生的HttpHandle,而不再是默认的Handler
factory。你切莫欲成立
ajax*子目录,这是一个只用来临时行使的杜撰的目,由此其余HttpHandler可以为此他们自己之目来使用.ashx扩张名的文件。

 

布置页面

      
现在我们准备好起始代码编写了。打开一个新的网页依旧就在的页面,在这codebehind文件被的Page_Load事件被加进以下代码:

 

‘vb.net
Public Class Index
  Inherits System.Web.UI.Page
 
  Private Sub Page_Load(sender As Object, e As EventArgs) Handles MyBase.Load
    Ajax.Utility.RegisterTypeForAjax(GetType(Index))
  ‘…
  end sub
  ‘…
End Class

 

//C#
public class Index : System.Web.UI.Page{
   private void Page_Load(object sender, EventArgs e){
      Ajax.Utility.RegisterTypeForAjax(typeof(Index));     
      //…                                       
   }
   //… 
}

针对RegisterTypeForAjax方法的调用在页面暴发如下的javascript代码(此外一种植接纳,你啊堪人工在页面及上加如下的javascript代码)

<script language="javascript" src="ajax/common.ashx"></script>
<script language="javascript"
           src="ajax/NAMESPACE.PAGECLASS,ASSEMBLYNAME.ashx"></script>

面这段代码的粗体部分NAMESPACE.PAGECLASS,ASSEMBLYNAME义如下

NAMESPACE.PAGECLASS
当前页面的命名空间和类
ASSEMBLYNAME
当前页面的程序集的名称

脚是以AjaxPlay项目中sample.aspx的示范输出:

<%@ Page Inherits="AjaxPlay.Sample" Codebehind="sample.aspx.cs" … %>
<html>
 <head>
  <script language="javascript" src="ajax/common.ashx"></script>
  <script language="javascript"
          src="ajax/AjaxPlay.Sample,AjaxPlay.ashx"></script>
 </head>
  <body>  
    <form id="Form1" method="post" runat="server">
       …
    </form>
  </body>
</html>

你可以测试一下,人工通过浏览器将src
path(通过查看源文件并copy)打开,一切都可以正常的工作。如若出口了任意义之公文表示到近来截止是对的,假若出口asp.net错误,则表示中出现了左。

      
固然你不通晓HttpHandle的做事办法,也相应可以通晓地点的描述。通过web.config,我们得保发送向ajax/\.ashx*的央浼由大家打定义之语句柄来处理,很明朗,两单脚论号由由定义句子柄处理。

      

编纂服务端函数

      
现在我们编辑服务器端函数,他们好于客户端异步的调用。虽然现近来尚免克帮忙周之回路,我们仍坚称服务器端添加效果。在codebehind文件的页面类里,添加底下的不二法门:

‘VB.Net
<Ajax.AjaxMethod()> _
Public Function ServerSideAdd (byval firstNumber As Integer, byval secondNumber
                                                 As Integer) As Integer
 Return firstNumber + secondNumber
End Function

 

//C#
[Ajax.AjaxMethod()]
public int ServerSideAdd(int firstNumber, int secondNumber)
{
  return firstNumber + secondNumber;
}

小心,那多少个函数有Ajax.AjaxMethod()定制性,属性服务会报ajax封装类为夫模式创制一个javascript代理,这样才可以叫客户端调用。

      

定制客户端调用

      
接下来当客户端用javascript调用函数。Ajax封装类会创造一个javascript函数,带有两独参数,名字是
类名.ServerSideAdd。作为最主旨的效果,我们所欲发的单是调用这多少个措施以传递参数:

 

<%@ Page Inherits="AjaxPlay.Sample" Codebehind="sample.aspx.cs" … %>
<html>
 <head>
  <script language="javascript" src="ajax/common.ashx"></script>
  <script language="javascript"
          src="ajax/AjaxPlay.Sample,AjaxPlay.ashx"></script>
 </head>
  <body>  
    <form id="Form1" method="post" runat="server">
      <script language="javascript">
        var response = Sample.ServerSideAdd(100,99);
        alert(response.value);
      </script>
    </form>
  </body>
</html>

理所当然,大家无克将这么强的功效只用来经alert来提醒浏览者,这就是干吗有的客户端代理(如
类名.ServerSideAdd函数)同时寓一个万分的定制性。这么些特性是用来拍卖服务器响应的回调函数:

Sample.ServerSideAdd(100,99, ServerSideAdd_CallBack);

function ServerSideAdd_CallBack(response){
 if (response.error != null){
   alert(response.error);
   return;
 }
 alert(response.value);
}

从地点的代码中可以看,我们呢ServerSideAdd函数增添了一个极度参数ServerSideAdd_CallBack,这些参数就是用来拍卖服务器端响应的客户端函数。这一个callback函数接受一个饱含四单关键特性的response对象:

value
服务器端函数执行的返回值(可能是一个字符串、自定义对象或者dataset)
error
如果发生错误,则返回错误信息.
request
原始的xmlHttpRequest请求
context
一个上下文对象

我们首先应检查是否来左有,你能够经当服务器端函数抛来特别来落实之error属性。在点是事例中,大家简要的alert了一个价,就是value属性;request属性可以据此来收获额外的消息(见底的表)

 

如果你想了解更多的关于XmlHttpRequest的知识,可以查看下面的链接: http://www.quirksmode.org/blog/archives/2005/02/xmlhttp_linkdum.html

 

拍卖项目

重回一个复杂类型

      
Ajax可以支撑除了大家地点ServerSideAdd函数再次来到的Int值以外很多门类。他可以一直襄助integers,
strings, double, booleans, Date提姆(Tim)e, DataSets 和
DataTables,也匡助简的自定义类型及数组。其他的品类通过其ToString模式来回到字符串。

    再次回到DataSet的工作就是比如真正的.net
Dataset.给来一个返DataSet的劳务器端函数,大家可因此下的方法以客户端呈现:

<script language="JavaScript">
//Asynchronous call to the mythical "GetDataSet" server-side function
function getDataSet(){
 AjaxFunctions.GetDataSet(GetDataSet_callback);   
}
function GetDataSet_callback(response){
 var ds = response.value;
 if(ds != null && typeof(ds) == "object" && ds.Tables != null){
  var s = new Array();
  s[s.length] = "<table border=1>";
  for(var i=0; i<ds.Tables[0].Rows.length; i++){
   s[s.length] = "<tr>";
   s[s.length] = "<td>" + ds.Tables[0].Rows[i].FirstName + "</td>";
   s[s.length] = "<td>" + ds.Tables[0].Rows[i].Birthday + "</td>";
   s[s.length] = "</tr>";
  }
  s[s.length] = "</table>";
  tableDisplay.innerHTML = s.join("");
 }
 else{
  alert("Error. [3001] " + response.request.responseText);
 }
}
</script>

Ajax也可支撑从定义类,不过得这多少个近乎是可给类别化的。如下边的接近:

[Serializable()]
public class User{
 private int _userId;
 private string _firstName;
 private string _lastName;
 
 public int userId{
  get { return _userId; }
 }
 public string FirstName{
  get { return _firstName; }
 }
 public string LastName{
  get { return _lastName; }
 }
 
 public User(int _userId, string _firstName, string _lastName){
  this._userId = _userId;
  this._firstName = _firstName;
  this._lastName = _lastName;
 }
 public User(){}
 
 [AjaxMethod()]
 public static User GetUser(int userId){
  //Replace this with a DB hit or something 🙂
  return new User(userId,"Michael", "Schwarz");
 }
}

咱得通过调用RegisterTypeForAjax向服务器注册GetUser代理

private void Page_Load(object sender, EventArgs e){
 Utility.RegisterTypeForAjax(typeof(User));
}

以客户端大家可由此这样的道调用GetUser函数:

 
<script language="javascript">
function getUser(userId){
 User.GetUser(GetUser_callback);
}
function GetUser_callback(response){
 if (response != null && response.value != null){
  var user = response.value;
  if (typeof(user) == "object"){         
   alert(user.FirstName + " " + user.LastName);
  }
 }
}
getUser(1);
</script>

回到值同服务器端对象同发生四只属性(FirstName, LastName and UserId)。

 

翻译注:其他的路只好出于开发者通过当服务器端函数在回去值平日由定义转换为ajax帮助之档次来落实了,ajax推荐下ToString方法。

 

其它干活方法

 

于其它类注册函数

以上头的例子及描述着,我们且是由此以页面的codebehind文件里好函数的挂号,但连无是说只好于页面的codebehide文件里做到注册,我们为可以当旁类中注册函数。记念一下,Ajax封装类是由此以特定类里面找这多少个有Ajax.AjaxMethod()属性之章程来成功工作之,这一个类似在客户端又经过简单个script片断来好回值描述。使用Ajax.Utility.RegisterTypeForAjax,我们可收获其他大家记忆得近似的详尽内容。例如,下边的例证可以证实大家以任何类中以劳务器端函数是合法的:

Public Class AjaxFunctions
 <Ajax.AjaxMethod()> _
 Public Function Validate(username As String, password As String) As Boolean
  ‘do something
  ‘Return something
 End Function
End Class

可是大家得首先在调用页面注册之代理类,类的名字不再是页面类,而是我们运用的是类似:

‘Vb.Net
Private Sub Page_Load(sender As Object, e As EventArgs) Handles MyBase.Load
 Ajax.Utility.RegisterTypeForAjax(GetType(AjaxFunctions))
 ‘…
End Sub

 

//C#
private void Page_Load(object sender, EventArgs e){
 Ajax.Utility.RegisterTypeForAjax(typeof(AjaxFunctions));
 //…
}

切记,客户端调用利用这种格式的讳<ClassName>.<ServerSideFunctionName>。由此,假如下面的Serversideadd函数位于AjaxFunctions类,而不是页面类的话语,客户端调用则变成:AjaxFunctions.ServerSideAdd(1,2)

 

代理是哪工作的也?

亚只script标签,如下边的言传身教

<script type=”text/javascript”
src=”/cqyd/ajax/cqyd.SchemeSendWatch,cqyd.ashx”></script>

凡是由于Ajax
utility通过命名空间、类以及页面程序集自动生成的(当然为堪人工参预),从这点我们好想到Ajax.PageHandlerFactory是因此反射来获取有定制性之函数的底细。很扎眼,Handler寻找带有AjaxMethod定制性的函数,取得他们之风味(再次回到路、名称、参数)并因这一个信息成立客户端代理。特别之,ajax创制一个以及类别相同的JavaScript对象作为代理。

 

返回Unicode字符

Ajax.net可以起劳动器端向客户端重回Unicode字符,为了完成就或多或少,在劳务端函数重临时再次来到的价值必须是Html编码的:

[Ajax.AjaxMethod]
public string Test1(string name, string email, string comment){
 string html = "";
 html += "Hello " + name + "<br>";
 html += "Thank you for your comment <b>";
 html += System.Web.HttpUtility.HtmlEncode(comment);
 html += "</b>.";
 return html;
}

SessionState

每当服务端函数,你也许用承受传送的session信息,为了成功这点,必须要在怀恋实现之艺术的服务端函数的Ajax.AjaxMethod属性上传递一个参数。

   
在查阅ajax可以襄助session的时候,我们先看外的特征。在底下那事例中,大家来一个文档管理网,当一个用户指向文档举办编辑的当儿会被这文档加锁,其他用户需要等到这文档可用时才可以改改。不使Ajax,用户用不断等待刷新,因为不得不不断的夺检查文档的状态是不是也可用,这本不是一个深好的方案。用ajax的session
state襄助,这就是于容易了。

   
大家先是写一个函数,这些函数通过遍历文档ID找到用户需要的文档,存储到session里,并回没有占用的文档:

 

‘Vb.Net
<Ajax.AjaxMethod(HttpSessionStateRequirement.Read)> _
Public Function DocumentReleased() As ArrayList
 If HttpContext.Current.Session("DocumentsWaiting") Is Nothing Then
  Return Nothing
 End If
 Dim readyDocuments As New ArrayList
 Dim documents() As Integer = CType(HttpContext.Current.Session("DocumentsWaiting"), Integer())
 For i As Integer = 0 To documents.Length – 1
  Dim document As Document = document.GetDocumentById(documents(i))
  If Not document Is Nothing AndAlso document.Status = DocumentStatus.Ready Then
   readyDocuments.Add(document)
  End If
 Next
 Return readyDocuments
End Function

 

 

//C#
[Ajax.AjaxMethod(HttpSessionStateRequirement.Read)]
public ArrayList DocumentReleased(){
 if (HttpContext.Current.Session["DocumentsWaiting"] == null){
  return null;
 }
 ArrayList readyDocuments = new ArrayList();
 int[] documents = (int[])HttpContext.Current.Session["DocumentsWaiting"];
 for (int i = 0; i < documents.Length; ++i){
  Document document = Document.GetDocumentById(documents[i]);
  if (document != null && document.Status == DocumentStatus.Ready){
    readyDocuments.Add(document);
  }       
 }
 return readyDocuments;
 }
}

咱俩以性质参数中指明了HttpSessionStateRequirement.Read(还是能是Write
and ReadWrite)

下写javascript函数来行使此法子带来的结果:

<script language="javascript">
function DocumentsReady_CallBack(response){
 if (response.error != null){
  alert(response.error);
  return;
 }
 if (response.value != null && response.value.length > 0){
  var div = document.getElementById("status");
  div.innerHTML = "The following documents are ready!<br />";
  for (var i = 0; i < response.value.length; ++i){
   div.innerHTML += "<a href=\"edit.aspx?documentId=" + response.value[i].DocumentId + "\">" + response.value[i].Name + "</a><br />";
  }      
 }
 setTimeout(‘page.DocumentReleased(DocumentsReady_CallBack)’, 10000);
}
</script> 
<body onload="setTimeout(‘Document.DocumentReleased(DocumentsReady_CallBack)‘, 10000);"> 

页面加载后每10分钟为服务器函数请求一差。假使发归,则call
back函数检查response,并把新型的结果显示出来。

 

结论

Ajax技术可以让客户端提供充分的客户体验,而ajax.net为公容易之兑现如此强劲的效能提供了也许,你得通过上面的链接查看ajax.net的时文档

Keep a close eye on the AJAX .Net wrapper website:
For a good hands-on sample, check out the following demo application:

 

 

Feedback

相关文章