DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> AJAX入門 >> AJAX基礎知識 >> 甩掉ashx和asmx使用jQuery.ajaxWebService請求WebMethod簡練處理Ajax
甩掉ashx和asmx使用jQuery.ajaxWebService請求WebMethod簡練處理Ajax
編輯:AJAX基礎知識     

在WebForm下 開發ajax程序,需要借助於一般處理程序(*.ashx)或web服務(*.asmx),並且每一個ajax請求,都要建一個這樣的文件,如此一來,如果在一個項目中ajax程序多了,勢必會產生一堆的.ashx或.asmx,雖然於程序本身無礙,但那一堆文件看上去總覺得有傷大雅。那麼可不可以丟掉這些.ashx和.asmx,選擇一種更簡練的方式來做ajax程序呢。

答案是肯定的,那就是:WebMethod 。(此方法是在.net3.5版本下調試的,在.net2.0下有問題)

首先在aspx.cs文件裡建一個公開的靜態方法,然後加上WebMethod屬性。

[WebMethod]
public static string GetUserName() 
{
//......
} 

如果要在這個方法裡操作session,那還得將WebMethod的EnableSession 屬性設為true 。即:

[WebMethod(EnableSession = true)]//或[WebMethod(true)]
public static string GetUserName() 
{
//......
}

然後我們就寫ajax程序來訪問這個程序,我們就用jQuery吧。

$.ajax({
type: "POST",
contentType: "application/json",
url: "WebForm2.aspx/GetUserName",
data: "{}",
dataType: "json",
success: function(){.......}
}); 

  這裡對幾個參數做一下簡單的說明,

  type:請求的類型,這裡必須用post 。WebMethod方法只接受post類型的請求。

  contentType:發送信息至服務器時內容編碼類型。我們這裡一定要用application/json 。

  url:請求的服務器端處理程序的路徑,格式為"文件名(含後綴)/方法名"

  data:參數列表。注意,這裡的參數一定要是json格式的字符串,記住是字符串格式,如:"{aa:11,bb:22,cc:33 , ...}"。如果

你寫的不是字符串,那jquery會把它實序列化成字符串,那麼在服務器端接受到的就不是json格式了,且不能為空,即使沒有參數也要寫成"{}",如上例。

很多人不成功,原因就在這裡。

  dataType:服務器返回的數據類型。必須是json,其他的都無效。因為webservice 是一json格式返回數據的,其形式為:{"d":"......."}。

  success:請求成功後的回調函數。你可以在這裡對返回的數據做任意處理。

  我們可以看到其中一些參數值是固定的,所以從復用性的角度考慮,我們可以給jquery做一個擴展,對上面的函數做一下簡單的封裝:

我們建一個腳本文件叫 jquery.extend.js。在裡面寫一個叫ajaxWebService的方法(因為webmethod其實就是WebService嘛,故此方法對請求*.asmx也是有效的),代碼如下:

/// <summary>
/// jQuery原型擴展,重新封裝Ajax請求WebServeice
/// </summary>
/// <param name="url" type="String">
/// 處理請求的地址
///</param>
/// <param name="dataMap" type="String">
/// 參數,json格式的字符串
///</param>
/// <param name="fnSuccess" type="Function">
/// 請求成功後的回調函數
///</param>
$.ajaxWebService = function(url, dataMap, fnSuccess) {
$.ajax({
type: "POST",
contentType: "application/json",
url: url,
data: dataMap,
dataType: "json",
success: fnSuccess
});
}

好了,這樣我們請求webmethod方法 就可以這樣寫了:

$.ajaxWebService("WebForm2.aspx/GetUserName", "{}", function(result) {......}); 

最後:如果你的項目中ajax程序非常多(這種情況是可能存在的,我做過一個網站,是個sns,全程ajax,幾乎每個操作都用了ajax),你覺得把WebMethod方法寫在各個aspx頁面裡很零散,那麼你可以專門建一個頁面(如:WebMethods.aspx)來存放。

以上所述是小編給大家介紹的甩掉ashx和asmx使用jQuery.ajaxWebService請求WebMethod簡練處理Ajax,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對網站的支持!

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