在ASP.NET AJAX 1.0框架中访问Web服务
生活随笔
收集整理的這篇文章主要介紹了
在ASP.NET AJAX 1.0框架中访问Web服务
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
一、 簡介
??? 如今,微軟最新推出的AJAX框架為ASP.NET AJAX 1.0(下載地址為[url]http://ajax.asp.net/downloads/default.aspx[/url],由ASP.NET 2.0 AJAX Extensions 1.0和ASP.NET AJAX Control Toolkit兩部分組成)。這個框架具有如下優點:
? 豐富的Web用戶體驗框架;
? 與.NET編程模型無縫地集成到一起;
? 開發者可以自由選擇應用程序模型以服務器端為中心還是以客戶端為中心;
? 完全跨平臺并基于標準實現;
? 無需客戶端安裝。
???
??? ASP.NET AJAX 1.0以面向對象技術對JavaScript進行了高級包裝,便于開發人員以流行的面向對象方式進行客戶端JavaScript編程,從而大大簡化了JavaScript編碼及調試。
??? 在以前的ASP.NET 2.0 Web應用程序中,為了使客戶端能夠訪問Web服務,開發者還需要創建一個運行于服務器端的應用程序(或由系統提供相應的代理),還需要創建一個Web應用程序,使用Visual Studio .NET或wsdl.exe生成Web服務的代理,并用該Web應用程序實現這個代理?,F在,開發者終于可以完全在客戶端實現對Web服務的調用了。在創建客戶端頁面時,只要在ScriptManager的<Services>標簽中添加<asp:ServiceReference>元素,指向你的Web服務即可。
??? 本文中,我將通過一個具體示例來實現直接通過以ASP.NET AJAX 1.0框架JavaScript訪問Web服務。
???
??? 【作者注】在此,我們省略了有關ASP.NET AJAX 1.0的具體下載及配置介紹。如果你是ASP.NET AJAX 1.0新手,請細致查看其中附帶的幫助說明及在線文檔。
二、 案例分析
(一)創建Web頁面
啟動Visual Studio 2005,選擇“文件→新建網站…”,然后選擇“ASP.NET AJAX-Enabled Web Site”模板,命名工程為“WebServiceTest”,并選擇C#作為編程語言(如圖1所示),最后點擊OK。
???
圖1.使用“ASP.NET AJAX-Enabled Web Site”模板快速創建AJAX應用程序。
然后,把Default.aspx頁面修改成如下圖2所示形式:?
???
??? 圖2.設計調用Web服務的客戶端Web頁面。
??? 注意,在上面的向導操作完成后,系統自動為頁面添加了一個ScriptManager服務器控件。這個控件是整個ASP.NET AJAX 1.0框架的核心,它管理著客戶端運行時所需要的用于實現客戶端功能的各種JavaScript腳本庫的部署。而且,在新版本的框架中,這個控件的功能更為強大,使用更為簡易,從下面的例子中我們即可看出這一點。此外,為了便于我們在本文中試驗使用客戶端JavaScript調用Web服務,上面表單中的按鈕為HTML Input Button控件,而另外三個文本框都是HTML Input Text控件。
(二)創建Web服務
接下來,我們將編寫一個web服務以便由瀏覽器端JavaScript訪問之。在此,僅為說明問題,我們使用了一個最簡單的二整數求和的例子。
1. 右擊工程,并點擊“添加新項…”。在“添加新項”對話框中,從已安裝的模板列表中選擇“Web服務”,并且命名為SumService.asmx(如圖3所示)。
??? 圖3.在工程中添加“Web服務”模板。
2. 通過第1步,有兩個文件將被創建到你的應用程序中。一個是SumService.asmx,位于你的應用程序根目錄下;另一個是SumService.cs,位于App_Code文件夾下,相應于該web服務的Code Behind文件。
3. 打開文件SumService.cs。我們要在這個文件中編寫web方法以便實現前面的目標。
4. 在當前文件中添加下列必要的命名空間(加粗部分):?
? ………… using System.Web.Services.Protocols; using System.Web.Script.Services; 5. 據框架提供的資料,在此必須使用ScriptService屬性來修飾web服務,這樣才使得JavaScript腳本能夠訪問這個服務。為此,在服務類定義的上面添加下列一行(加粗部分)。
[WebService(Namespace= "[url]http://tempuri.org/[/url]")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [ScriptService] public class SumService: System.Web.Services.WebService { 6. 在這個服務類中,我們將編寫一個WebMethod—GetSum,它將返回兩個整數的和。該方法的具體定義形式如下所示:?
? [WebMethod] public int GetSum (int a,int b) { return(a+b); }
【注】有關Web方法的定義形式在框架資料中提供了多種形式的屬性修飾符,主要是針對這些方法可能返回不同復雜程度的數據,在此略過。 (三)調用Web服務
??? 接下來,切換到上面Web表單的設計視圖,點選ScriptManager1控件,在其“屬性”窗口中點擊“Services”屬性右邊的“…”進入到“ServiceReference集合編輯器”對話框并按下面圖4所示進行操作。
圖4.基于“屬性”對話框配置方式編程ScriptManager控件。
最后源碼視圖中代碼如下所示:?
<asp:ScriptManager ID="ScriptManager1" runat="server" > <Services> <asp:ServiceReference Path="SumService.asmx" /> </Services> </asp:ScriptManager>
通過此操作,我們在ScriptManager的<Services>標簽中創建了一個ServiceReference實例,指向SumService.asmx。
? 【注】我們從圖4中的序號①處還可以看出,完全可以為ScriptManager控件指定它所控制下的.js腳本文件;但由于本文示例沒有在獨立的.js文件中訪問Web服務,所以也在此略過。
??? 最后,我們來編寫調用Web服務代理的代碼,并將頁面上的兩個文本域的值傳遞給該Web服務。在設計視圖中,雙擊“獲取求和結果”按鈕生成該按鈕的事件處理函數。然后,將下列代碼添加到其相應的事件處理器函數中:? function btnSum_ { SumServiceSpace.SumService.set_defaultSucceededCallback( OnSuccess);//這一句必須有 //SumServiceSpace.SumService.set_defaultFailedCallback(OnFailure); SumServiceSpace.SumService.GetSum( eval(form1.TextBoxA.value), eval(form1.TextBoxB.value), OnSuccess() ); } function OnSuccess(result){ $get("TextBoxSum").value=result; } 在JavaScript中,可以用HTML控件所在的表單名作為前綴,加上該HTML控件的名稱來得到這個控件的引用。在本示例中,表單名稱為form1,因此通過form1.TextBoxA.value即可得到TextBoxA文本域中的值。
另外,在本示例中,Web服務的類名為SumService,它定義于SumServiceSpace命名空間中。
??? 特別需要注意的是,在此所使用的從JavaScript中調用Web服務的方法是使用了回調函數思想。其中,OnSuccess即對應這個回調函數,所有對于Web服務方法返回值(result)的操作都是在這里完成的。此外,你還可能已經注意到了Web服務中定義的GetSum方法僅僅接受2個參數,而在JavaScript的調用中卻傳入了3個參數(其實還有一個,在此省去了)。這個附加的參數正是代表了回調函數的名稱,用于指向服務調用成功完成時執行的函數(另一個相應于服務調用超時或出錯時執行的回調函數)。顯然,這種調用方式將Ajax中異步特性的處理代碼隱藏了起來(這不由得我們回想起Win32中大量回調函數的原理及使用方法)。
在本示例中,按照如下代碼編寫這個服務調用成功時的回調函數:
function OnSuccess(result){
$get("TextBoxSum").value=result;
}
??? 注意,無論調用成功或超時,Web服務中定義的GetSum方法都將返回一個值,包含在回調函數的result參數中。在本示例中,對于一次成功的請求/響應,result參數將包含經過計算后的兩個整數之和。此外,$get("TextBoxSum")相應于DOM編程中常用的document.getElementById("TextBoxSum"),ASP.NET Ajax框架對此作了簡化。 (四)調試與運行結果
按F5運行此示例時,運行結果如圖5所示:
???
??? 圖5.通過客戶端JavaScript調用Web服務示例運行時刻快照。
? 【疑問】讀者在調試時會注意到,在點擊圖5中按鈕出現結果的瞬間會在第三個文本框中先出現一個“Undefined”的字符串,然后才顯示結果6912,但目前我也沒有找到原因,歡迎朋友們幫助解決。
三、 小結
? 本文通過一個簡單實例介紹了如何使用ASP.NET AJAX 1.0框架對JavaScript以面向對象技術來訪問Web服務。同時,我們也領略了該框架提供的腳本庫使得JavaScript更易于編寫、調試和維護。其實,ASP.NET AJAX 1.0框架還對服務端相關AJAX操作進行了大量高級包裝并引入了強有力的服務器端擴展控件。總之,ASP.NET AJAX 1.0框架很有希望成為廣大商家基于ASP.NET 2.0平臺并利用AJAX技術進行Web開發的首選擴展框架。
??? 如今,微軟最新推出的AJAX框架為ASP.NET AJAX 1.0(下載地址為[url]http://ajax.asp.net/downloads/default.aspx[/url],由ASP.NET 2.0 AJAX Extensions 1.0和ASP.NET AJAX Control Toolkit兩部分組成)。這個框架具有如下優點:
? 豐富的Web用戶體驗框架;
? 與.NET編程模型無縫地集成到一起;
? 開發者可以自由選擇應用程序模型以服務器端為中心還是以客戶端為中心;
? 完全跨平臺并基于標準實現;
? 無需客戶端安裝。
???
??? ASP.NET AJAX 1.0以面向對象技術對JavaScript進行了高級包裝,便于開發人員以流行的面向對象方式進行客戶端JavaScript編程,從而大大簡化了JavaScript編碼及調試。
??? 在以前的ASP.NET 2.0 Web應用程序中,為了使客戶端能夠訪問Web服務,開發者還需要創建一個運行于服務器端的應用程序(或由系統提供相應的代理),還需要創建一個Web應用程序,使用Visual Studio .NET或wsdl.exe生成Web服務的代理,并用該Web應用程序實現這個代理?,F在,開發者終于可以完全在客戶端實現對Web服務的調用了。在創建客戶端頁面時,只要在ScriptManager的<Services>標簽中添加<asp:ServiceReference>元素,指向你的Web服務即可。
??? 本文中,我將通過一個具體示例來實現直接通過以ASP.NET AJAX 1.0框架JavaScript訪問Web服務。
???
??? 【作者注】在此,我們省略了有關ASP.NET AJAX 1.0的具體下載及配置介紹。如果你是ASP.NET AJAX 1.0新手,請細致查看其中附帶的幫助說明及在線文檔。
二、 案例分析
(一)創建Web頁面
啟動Visual Studio 2005,選擇“文件→新建網站…”,然后選擇“ASP.NET AJAX-Enabled Web Site”模板,命名工程為“WebServiceTest”,并選擇C#作為編程語言(如圖1所示),最后點擊OK。
???
圖1.使用“ASP.NET AJAX-Enabled Web Site”模板快速創建AJAX應用程序。
然后,把Default.aspx頁面修改成如下圖2所示形式:?
???
??? 圖2.設計調用Web服務的客戶端Web頁面。
??? 注意,在上面的向導操作完成后,系統自動為頁面添加了一個ScriptManager服務器控件。這個控件是整個ASP.NET AJAX 1.0框架的核心,它管理著客戶端運行時所需要的用于實現客戶端功能的各種JavaScript腳本庫的部署。而且,在新版本的框架中,這個控件的功能更為強大,使用更為簡易,從下面的例子中我們即可看出這一點。此外,為了便于我們在本文中試驗使用客戶端JavaScript調用Web服務,上面表單中的按鈕為HTML Input Button控件,而另外三個文本框都是HTML Input Text控件。
(二)創建Web服務
接下來,我們將編寫一個web服務以便由瀏覽器端JavaScript訪問之。在此,僅為說明問題,我們使用了一個最簡單的二整數求和的例子。
1. 右擊工程,并點擊“添加新項…”。在“添加新項”對話框中,從已安裝的模板列表中選擇“Web服務”,并且命名為SumService.asmx(如圖3所示)。
??? 圖3.在工程中添加“Web服務”模板。
2. 通過第1步,有兩個文件將被創建到你的應用程序中。一個是SumService.asmx,位于你的應用程序根目錄下;另一個是SumService.cs,位于App_Code文件夾下,相應于該web服務的Code Behind文件。
3. 打開文件SumService.cs。我們要在這個文件中編寫web方法以便實現前面的目標。
4. 在當前文件中添加下列必要的命名空間(加粗部分):?
? ………… using System.Web.Services.Protocols; using System.Web.Script.Services; 5. 據框架提供的資料,在此必須使用ScriptService屬性來修飾web服務,這樣才使得JavaScript腳本能夠訪問這個服務。為此,在服務類定義的上面添加下列一行(加粗部分)。
[WebService(Namespace= "[url]http://tempuri.org/[/url]")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [ScriptService] public class SumService: System.Web.Services.WebService { 6. 在這個服務類中,我們將編寫一個WebMethod—GetSum,它將返回兩個整數的和。該方法的具體定義形式如下所示:?
? [WebMethod] public int GetSum (int a,int b) { return(a+b); }
【注】有關Web方法的定義形式在框架資料中提供了多種形式的屬性修飾符,主要是針對這些方法可能返回不同復雜程度的數據,在此略過。 (三)調用Web服務
??? 接下來,切換到上面Web表單的設計視圖,點選ScriptManager1控件,在其“屬性”窗口中點擊“Services”屬性右邊的“…”進入到“ServiceReference集合編輯器”對話框并按下面圖4所示進行操作。
圖4.基于“屬性”對話框配置方式編程ScriptManager控件。
最后源碼視圖中代碼如下所示:?
<asp:ScriptManager ID="ScriptManager1" runat="server" > <Services> <asp:ServiceReference Path="SumService.asmx" /> </Services> </asp:ScriptManager>
通過此操作,我們在ScriptManager的<Services>標簽中創建了一個ServiceReference實例,指向SumService.asmx。
? 【注】我們從圖4中的序號①處還可以看出,完全可以為ScriptManager控件指定它所控制下的.js腳本文件;但由于本文示例沒有在獨立的.js文件中訪問Web服務,所以也在此略過。
??? 最后,我們來編寫調用Web服務代理的代碼,并將頁面上的兩個文本域的值傳遞給該Web服務。在設計視圖中,雙擊“獲取求和結果”按鈕生成該按鈕的事件處理函數。然后,將下列代碼添加到其相應的事件處理器函數中:? function btnSum_ { SumServiceSpace.SumService.set_defaultSucceededCallback( OnSuccess);//這一句必須有 //SumServiceSpace.SumService.set_defaultFailedCallback(OnFailure); SumServiceSpace.SumService.GetSum( eval(form1.TextBoxA.value), eval(form1.TextBoxB.value), OnSuccess() ); } function OnSuccess(result){ $get("TextBoxSum").value=result; } 在JavaScript中,可以用HTML控件所在的表單名作為前綴,加上該HTML控件的名稱來得到這個控件的引用。在本示例中,表單名稱為form1,因此通過form1.TextBoxA.value即可得到TextBoxA文本域中的值。
另外,在本示例中,Web服務的類名為SumService,它定義于SumServiceSpace命名空間中。
??? 特別需要注意的是,在此所使用的從JavaScript中調用Web服務的方法是使用了回調函數思想。其中,OnSuccess即對應這個回調函數,所有對于Web服務方法返回值(result)的操作都是在這里完成的。此外,你還可能已經注意到了Web服務中定義的GetSum方法僅僅接受2個參數,而在JavaScript的調用中卻傳入了3個參數(其實還有一個,在此省去了)。這個附加的參數正是代表了回調函數的名稱,用于指向服務調用成功完成時執行的函數(另一個相應于服務調用超時或出錯時執行的回調函數)。顯然,這種調用方式將Ajax中異步特性的處理代碼隱藏了起來(這不由得我們回想起Win32中大量回調函數的原理及使用方法)。
在本示例中,按照如下代碼編寫這個服務調用成功時的回調函數:
function OnSuccess(result){
$get("TextBoxSum").value=result;
}
??? 注意,無論調用成功或超時,Web服務中定義的GetSum方法都將返回一個值,包含在回調函數的result參數中。在本示例中,對于一次成功的請求/響應,result參數將包含經過計算后的兩個整數之和。此外,$get("TextBoxSum")相應于DOM編程中常用的document.getElementById("TextBoxSum"),ASP.NET Ajax框架對此作了簡化。 (四)調試與運行結果
按F5運行此示例時,運行結果如圖5所示:
???
??? 圖5.通過客戶端JavaScript調用Web服務示例運行時刻快照。
? 【疑問】讀者在調試時會注意到,在點擊圖5中按鈕出現結果的瞬間會在第三個文本框中先出現一個“Undefined”的字符串,然后才顯示結果6912,但目前我也沒有找到原因,歡迎朋友們幫助解決。
三、 小結
? 本文通過一個簡單實例介紹了如何使用ASP.NET AJAX 1.0框架對JavaScript以面向對象技術來訪問Web服務。同時,我們也領略了該框架提供的腳本庫使得JavaScript更易于編寫、調試和維護。其實,ASP.NET AJAX 1.0框架還對服務端相關AJAX操作進行了大量高級包裝并引入了強有力的服務器端擴展控件。總之,ASP.NET AJAX 1.0框架很有希望成為廣大商家基于ASP.NET 2.0平臺并利用AJAX技術進行Web開發的首選擴展框架。
總結
以上是生活随笔為你收集整理的在ASP.NET AJAX 1.0框架中访问Web服务的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 使用DELPHI编写一个小的控件
- 下一篇: 按钮更新datagridview