ASP.NET的Callback實作

在ASP.NET 2.0內支援了最令人感興趣的內容, Callback功能, 雖然實務上, 可以利用多種自訂的 server side 程式實作 AJAX 功能, 但是在 ASP.NET 2.0內建的 Callback 功能還是令人激賞, 接下來我們看看如何在 ASP.NET 2.0 下實作這個 Callback 的功能. (本篇文章以 c# 為範例語言)

要實作 Callback 功能, 首先要先了解 ICallbackEventHandler 這個 interface, 該 interface 有兩個方法:

string GetCallbackResult ()
void RaiseCallbackEvent (string EventArgument)

所以要達成 callback 的物件必需繼承 ICallbackEventHandler 這個 interface 並且實作這兩個方法, 一般是寫在 Page 下, 以下為一個範例:

public partial class Default2 : System.Web.UI.Page, System.Web.UI.ICallbackEventHandler
{
   string strCallback;

   public void RaiseCallbackEvent(String eventArgument)
   {
       strCallback = eventArgument + " " + DateTime.Now.ToString("hh:mm:ss");
   }

   public string GetCallbackResult()
   {
       return strCallback;
   }

   protected void Page_Load(object sender, EventArgs e)
   {
       string strScript = "function ReceiveServerData(arg, context){ document.getElementById('"+TextBox1.ClientID+"').value = arg + ' ' + context; }";
       Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "myscript", strScript, true);
     
       string cbReference = Page.ClientScript.GetCallbackEventReference(this, "'arg'", "ReceiveServerData", "'222'");
       Button1.Attributes["onclick"] = cbReference;     
   }
}

上面的 aspx 程式先在 page 上放置一個 textbox 及一個 button, 用來進行測試這個 callback 的動作觸發及顯示的地方. 先解說 RaiseCallbackEvent 這個方法, 由於 callback 於 client 發回 request 後, 會先觸發到 server 的 RaiseCallbackEvent 並且將 client 傳回的一個參數 (上面的 ‘arg’)交給 RaiseCallbackEvent, 當然 server 可依該參數進行邏輯判斷進行不同的功能, 本範例僅組合出時間及將該參數合在一起, 並存回 page 內的 strCallback 變數裡, 接下來便由 GetCallbackResult 傳回資料, 這裡也可以寫邏輯, 不過沒有什麼彈性, 本範例就將 strCallback 回傳而已.

接下來要解說比較複雜的 Page_Load 的 page 起始事件內的一些要素.

我們要先定義一個 ReceiveServerData(arg, context) 的 client side javascript, 內容的 arg 為 server 回傳的資料(也就是從 GetCallbackResult 傳回的字串資料), 而 context 則是第二個變數, 這個變數是 for client side javascript 自己在完成 callback 時使用的, 也就是在上面看到的 ‘222’ 這個部分, 這個變數注意是 client side 的(當然可以從 server side 生成後放入, 但不會在 callback runtime 時改變, 在 callback runtime 是只有上面兩個方法會工作, RaiseCallbackEvent 及 GetCallbackResult, 然後就傳給 client side 的 ReceiveServerData 這個 javascript).

再來看 Page.ClientScript.RegisterClientScriptBlock 這個部分, 就只是將 ReceiveServerData 這個 javascript 寫上 web page 裡, 比較容易理解.

接下來的就是一個重點的程式碼, Page.ClientScript.GetCallbackEventReference 這個是用來產生 client side 的 callback javascript 程式, 內的參數第一個為 callback 的 reference, 傳入 page 自己的 this, 接下來的 3個參數都是 string, 分別為 callback 要傳回 RaiseCallbackEvent 的參數 ‘arg’ , 為什麼要給引號, 原因是因為要給這個產生 client side 的 javascript 用的, 所以要加上單引號. 再來是 callback 完成的 client side finished javascript, 目前是傳入前面的 ReceiveServerData function 名稱, 再來就是 callback 完成後, 要傳給 ReceiveServerData 的第二個參數, 目前是給 ‘222’, 引號的原因和前面相同.

產生好的 javascript 要指定給觸發 event 的 button, 也就是最後一行程式的設定, 將 button 的 onclick 指定為該 cbReference 的 javascript 程式.

接下來就可以測試囉, 發起程式後, 按下 button 會發生一個 callback, 接下來在 textbox 上出現我們期望的結果, arg 06:03:32 222 (這是我測試的時候的時間啦). 前面有 arg, 後面有 222, 也就達到我們預期的結果了.

之後將再解說這組 callback 後面用一些程式碼及方法.