DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> AJAX入門 >> AJAX詳解 >> 利用ajaxpro.dll進行Ajax的開發
利用ajaxpro.dll進行Ajax的開發
編輯:AJAX詳解     

1、Ajax.net 做為AJax技術在dotNet 框架下的實現,作者Michael Schwarz采取了一種封裝效果相當棒的技術:將客戶端處理XML、事件調用方式都封裝在2個Javascript文件中 (AjaxPro.prototype.js 和AjaxPro.core.JS),同時將這2個重要文件以資源的形式編譯於dll中,在處理客戶端請求其自定義的.ashx文件時,返回這兩個文件。 所以我們在使用AJax.Net時需要在Web.config中添加如下httpHandlers以 AjaxPro.AJaxHandlerFactory來處理.ashx文件:

在<system.web>與</system.web>之間插入以下代碼

<httpHandlers>

<add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AJaxPro"/>

</httpHandlers>

2、在此基礎上,AJax.Net開始對要求其處理的方法進行封裝,以便在客戶端通過 Javascript來調用。首先在用戶必須調用的另一個ashx文件即converter.ashx中做了方法的封裝,當然要支持任意多數量的參數及返 回值的處理,然後就是對於服務端的邏輯處理方法所在類的封裝處理。

如何開始使用AJax.Net

A:獲取AJax.Net 可以到 http://www.schwarz-interactive.de/ 下載(目前最新版6.4.15.1.)。

B:解壓zip並在需要使用的項目中添加對dll的引用(其中AjaxPro.dll為dotnet1.1版,AJaxPro.2.dll 為2.0版)

C:如同上面所說,在web.config中添加對ashx的處理

D:在服務端添加Ajax.net要處理的方法,假如我們要提供的服務是返回用戶輸入的字符的MD5校驗碼,那麼我們首先要做的是給這個方法加入需要AJax.Net處理使客戶端可以直接調用的屬性[AjaxPro.AJaxMethod]如下:

[AjaxPro.AJaxMethod]

public string Md5Hash(string sSou)

{

string sResult   ="";

byte[] byBuffer =   System.Text.Encoding.UTF8 .GetBytes(sSou);

System.Security.Cryptography.MD5CryptoServiceProvider   md = new System.Security.Cryptography.MD5CryptoServiceProvider();

byte[] result = md.ComputeHash(byBuffer);

for(int i=0; i< result.GetLength(0); i++)

{

   sResult += result[i].ToString("X2");

}

return sResult;

}

然後在Page_Load中注冊此類

private void Page_Load(object sender, System.EventArgs e)

{

        AjaxPro.Utility.RegisterTypeForAJax

        (typeof(WebForm1));

     }

E:在客戶端調用方法:

<script type="text/Javascript">

function getMd5()

{

   var a = document.getElementById("source").value;

     var c = TAJax.WebForm1.Md5Hash(a);

     alert(c.value);

}

</script>

<input type="text" id="source" name="source" >

<input type="button" name="sub" onclick="getMd5()" value="提交">

當然這裡TAJax.WebForm1就是實現類的全名了(包括namespace).

這樣一個簡單應用就算完成了,怎麼樣,是不是簡單的很?在這麼簡單的使用了AJax.Net後你是不是和我一樣覺得不滿足,好像還有一些工作可以做?對了,接下來我們將繼續深度使用並實現無ASPx文件的邏輯層和表現層的徹底分離。

應用AJax.net在ASP.Net中實現無ASPx文件應用,徹底分離邏輯層和表現層

ASP.Net中居然沒有aspx文件,要如何實現呢?我不知道你想過沒有,我反正覺得這是 個艱巨的任務;因為ASPx文件做為一個橋梁連接了前台和後台,一個runat=server為我們做了太多的事情,我們自己實現也不是完全不可以,不過 費盡周折的意義可能並不大;說到意義——這樣做的意義我想不用我說,大家自己想想吧,呵呵。閒話少絮。我們接著進入正題。

通過前面的描述,我想大家一定可以猜到關鍵點。對了,就是那幾個JS,我們啟動程序,查看源文件,奧妙就在這裡:

<script type="text/Javascript" src="/TAjax/AJaxpro/prototype.ashx"></script>

<script type="text/Javascript" src="/TAjax/AJaxpro/core.ashx"></script>

<script type="text/Javascript" src="/TAjax/AJaxpro/converter.ashx"></script>

<script type="text/Javascript" src="/TAjax/ajaxpro/TAjax.WebForm1,TAJax.ashx"></script>

注:TAJax在VB中稱為項目名稱.在C#上則為名稱空間名.WebForm1為類名

前面3個文件我就不在多說,前面已經說過,我們只看最後一個,那不正是AJax.Net對我們服務端類的封裝嗎?

addNamespace("TAJax");

TAJax.WebForm1_class = Class.create();

Object.extend(TAjax.WebForm1_class.prototype, Object.extend(new AjaxPro.AJaxClass(), {

        Md5Hash: function(sSou) {

               return this.invoke("Md5Hash", {"sSou":sSou}, this.Md5Hash.getArguments().slice(1));

        },

        initialize: function() {

               this.url = '/TAjax/ajaxpro/TAjax.WebForm1,TAJax.ashx';

        }

}));

TAjax.WebForm1 = new TAJax.WebForm1_class();

<p style="te 淘寶購物導航 xt-indent: 2em">既然原理明白了,分離就簡單了,參照上一部份,我們的步驟從D開始改變

 

D:新建一個類Admin,將WebForm1.ASPx.cs中的代碼拿過來。

注:在VB.Net中拷過來時只需拷貝Md5Hash那段函數即可.不必再構造函數中注冊此類.C#中我沒試過

     <AjaxPro.AJaxMethod()> _

     Public Function Md5Hash(ByVal sSou As String) As String

         Dim sResult As String = ""

         Dim byBuffer As Byte() = System.Text.Encoding.UTF8.GetBytes(sSou)

         Dim md As System.Security.Cryptography.MD5CryptoServiceProvider = New System.Security.Cryptography.MD5CryptoServiceProvider

         Dim result As Byte() = md.ComputeHash(byBuffer)

         Dim i As Integer

         For i = 0 To result.GetLength(0) - 1

             sResult += result(i).ToString("X2")

         Next

         Return sResult

     End Function

E:在客戶端調用方法:

新建一個htm文件include.htm,將前述四行調用放在這裡

新建一個htm文件test.htm,內容當然就是前面的客戶端表示層。重要的一點就是要添加一個iframe如下:

<iframe name="include" marginwidth=0 marginheight=0   src="include.htm" frameborder=0></iframe>

同樣,修改調用為

<script type="text/Javascript">

function getMd5()

{

     var a   = document.getElementById("source").value;

     var c = include.TAJax.Admin.Md5Hash(a);

     alert(c.value);

}

</script>

擴展:如果多處調用而且調用方法較長,你當然可以再對應每個業務類做個JS文件,將其中的調用放在一起。

==============================================================================

前段時間要用到AJax,不過,完全靠自己來寫嫌太煩,不願做些麻煩事。

碰巧看到了AJaxpro,嘗試了一下,覺得很簡單,很實用,兼容性也很好。

AJaxPro的官網是http://AJaxpro.info,你可以下載到最新的AJaxPro組件。如果你想下載,可以點裡這裡

在下載的的文件中,有VS2005的模板,安裝了VS2005模板,就可以在VS2005中直接建立AjaxProWebSite了,在建立的AjaxProWebSite中,有一個默認的Demo,其實通過它,就能夠完全了解AJaxPro的用法。

如果你用的是.Net2.0,且不用VS2005的話。你只需要把AJaxPro.2.dll放入應用程序的bin文件夾中,而且也只需要如下幾步:

1、修改web.config

在system.web節點下添加

<system.web>

      <httpHandlers>

        <add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AJaxPro.2"/>

      </httpHandlers>

2、將你的.Net方法添加AJaxMethod屬性

[AjaxPro.AJaxMethod]

public DateTime GetServerTime()

{

    return DateTime.Now;

}

3、在.Net方法中向客戶端注冊Javascript,用以Javascript使用

namespace MyDemo

{

    public class _Default

    {

      protected void Page_Load(object sender, EventArgs e)

      {

        AjaxPro.Utility.RegisterTypeForAJax(typeof(_Default));

      }

      [AjaxPro.AJaxMethod]

      public DateTime GetServerTime()

      {

        return DateTime.Now;

      }

    }

}

4、在客戶端用Javascript調用服務器端的方法,語法也很簡單

function getServerTime()

{

    MyDemo._Default.GetServerTime(getServerTime_callback);    // asynchronous call

}

// This method will be called after the method has been executed

// and the result has been sent to the clIEnt.

function getServerTime_callback(res)

{

    alert(res.value);

}

就這樣,簡單的幾步,就已經完成了。在客戶端用javascript異步調用服務器端的C# 方法,並可以得到服務器端的返回值,這個值會傳到Javascript,Javascript可以處理這個返回的值,這個示例是官方給出的示例,服務器端 返回的是一個DateTime,不過,我們也可以返回復雜的數據類型,像DataTable之類,總之,AjaxPro把AJax搞得很簡單。

不過,還有一點我沒完全弄清楚,就是AjaxPro.OnLoading,它可以在服務器未 發送回值的時候向客戶顯示的loading一類的東西;我在使用過程中,有時會出現AJaxPro沒有定義的情況。關於這一點,也在google groups上看到相關解答,不過自己還是沒有完全搞清楚

===============================================================================

AJaxPro可以寫Session

在服務器端page_load

AjaxPro.Utility.RegisterTypeForAJax(typeof(test));

this.Button_Write.Attributes.Add("onclick","WriteSession();");//寫session

this.Button_Read.Attributes.Add("onclick", "ReadSession();");//讀session

其他寫和讀的方法

/// <summary>

/// 寫session

/// </summary>

/// <param name="str"></param>

[AjaxPro.AjaxMethod(AJaxPro.HttpSessionStateRequirement.ReadWrite)]

public void WriteSession(string str)

{

Session["UserName"] = str;

}

/// <summary>

/// 讀session

/// </summary>

/// <returns></returns>

[AjaxPro.AjaxMethod(AJaxPro.HttpSessionStateRequirement.ReadWrite)]

public string ReadSession()

{

string str = "";

if (Session["UserName"] != null)

{

str = Session["UserName"].ToString();

}

return str;

}

 

客戶端代碼:

//4、訪問Session的值

//寫入

function WriteSession()

{

var str = "HAHA";

test.WriteSession(str,CallBack_WriteSession);

}

function CallBack_WriteSession(res)

{

if(res.error == null)

{

alert("OK");

}

else

{

alert(res.error.message);

}

}

//訪問

function ReadSession()

{

test.ReadSession(CallBack_ReadSession);

}

function CallBack_ReadSession(res)

{

if(res.error == null)

{

alert(res.value);

}

else

{

alert(res.error.message);

}

}

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved