使用ASP.Net 3.5 的Ajax与Web服务开发实例
生活随笔
收集整理的這篇文章主要介紹了
使用ASP.Net 3.5 的Ajax与Web服务开发实例
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
本文繼續介紹使用ASP.NET3.5中的AJAX環境中如何從客戶端JavaScript調用Web服務方法。編寫本文的目的在于讓大家深刻了解基于ASP.Net3.5的Ajax和Web的服務,雖然例子比較簡單,但是比較能說明問題。在這里我又介紹了命名空間System. Web.Script的方式確定客戶端調用Web服務方法。 在AJAX中調用Web服務方法可以提高Web用戶的體驗,微軟在ASP.NET3.5中的AJAX加入了它的新功能,新的功能可以從客戶端JavaScript調用Web服務方法無刷新整個頁面。AJAX技術使你能夠調用服務器端的方法,沒有post back。客戶端腳本可以提出請求的Web方法,并可以通過數據作為輸入參數的方法和數據也可以從服務器發回給客戶端瀏覽器。
? 為了使你的應用程序調用的ASP.NET Web service使用客戶端腳本,服務器異步通信層會自動生成的JavaScript代理類。代理類生成為每個Web服務的 一個<asp:ServiceReference>元素被列入<asp:ScriptManager>控制的頁面。
<asp:ScriptManager?runat="server"?ID="scriptManagerId">
?????<Services>
????????????<asp:ServiceReference??Path="WebService.asmx"?/>
?????</Services>
</asp:ScriptManager>
這是下載的代理類的瀏覽器在網頁加載時間,并提供了一個客戶端對象,代理調用方法的Web服務。在調用相應的方法所產生的JavaScript的代理類。該代理類打開通信與網絡服務。這些請求通過的XMLHTTP對象的瀏覽器異步通訊。? 如下圖所示,詳細規定了不同的層上的客戶機和服務器方面通訊框架。 <asp:ScriptReference>元素指定注冊一個JavaScript文件,用來在網頁中。只有在注冊CallWebServiceMethod.js文件,您才可以在方法上進行調用,調用Web服務方法的腳本是異步的。獲得返回值或以確定何時返回的請求,您必須提供一個成功的回調函數。回調函數被調用時,請求已成功完成,并且它包含的返回值(如果有的話)從Web方法調用。您也可以提供一個失敗的回調函數來處理錯誤。此外,您還可以通過用戶的背景資料,使用中的回調函數。 如下圖,是WCF和Ajax調用Web service時序圖。
???? 在上一篇文章(基于ASP.NET 3.5 Web Service 的JSON擴展應用)中已經講過,JSON - JavaScript對象符號是默認序列化格式,使用它進行數據轉換之間客戶端服務器請求。您可以禁用所有目前啟用的協議像HTTP-GET、HTTP-POST,甚至的XML格式的SOAP中使用的早期形式的Web服務。以下設置在Web.config文件同樣也是這樣使用。 <system.web>
????<webServices>
????????<protocols>
??????????<clear/>
????????</protocols>
??????</webServices>
</system.web>
? 請求一個Web服務方法通過這些層面。你可以看到如何使用一種方法,要求在一個可用的代理對象和Web請求中,并由一個XMLHttp對象在客戶端瀏覽器端運行。在服務器端,你的要求是與往常一樣是由一個HTTP處理程序,發出的XML/JSON序列化。 如下圖所示,asp.net 3.5調用Ajax與Web服務的類關系圖。
在AJAX中使用Web服務方法包括兩個步驟:第一步是,創建和定義Web服務。第二個步,是使用客戶端腳本來從一個網頁的服務通話方法。創建一個Web服務: 在System.Web.Scripts.Services命名空間,你可能會發現一個屬性類“ScriptSrvice ”,這需要適用于Web服務類,使Web服務方法可以調用來自客戶端的腳本。這將使代理生成腳本來生成一個代理對象對應于Web服務類。 同樣,在相同的命名空間,可能會發現另一個屬性類“ScriptMethod”,如果采用此屬性為Web方法,你可以指定哪些HTTP動詞是用來調用一個方法和響應形式。此屬性有三個參數描述如下: UseHttpGet :如果設置為true,將調用該方法使用HTTP GET命令。默認值為false 。
????? ResponseFormat :指定是否反應將序列化的簡JSON或XML 。默認值為JSON。
????? XmlSerializeString :指定是否所有返回類型,包括字符串類型,是為XML序列化的值將被忽略XmlSerializeString連續的響應來系列化的JSON 。
? 現在,創建新的Web使用ASP.NET Web Service模板在Microsoft Visual Studio 2008和修改Web服務類如下: using?System.Web.Script.Services;
namespace?AjaxWebService
{
????[WebService(Namespace?=?"http://localhost:1382/AjaxWebService/")]
????[WebServiceBinding(ConformsTo?=?WsiProfiles.BasicProfile1_1)]
????[ScriptService]
????public?class?Service?:?System.Web.Services.WebService
????{
????????string?myXmlData?=?@"<?xml?version=""1.0""?encoding=""utf-8""??>
????????????????<Book>
????????????????????<Title>Programming?ASP.NET?3.5,?AJAX?and?Web?Services</Title>
????????????????</Book>";
???????
????????///?<summary>
????????///?This?method?uses?JSON?response?formatting?
????????///?</summary>
????????///?<param?name="months"></param>
????????///?<returns></returns>
????????[ScriptMethod(ResponseFormat?=?ResponseFormat.Json)]
????????[WebMethod]
????????public?string?getNextBackupDate(int?months)
????????{
????????????return?DateTime.Now.AddMonths(months).ToShortDateString();
????????}
????????
????????///?<summary>
????????///?This?method?uses?XML?response?formatting
????????///?</summary>
????????///?<returns></returns>
????????[ScriptMethod(ResponseFormat?=?ResponseFormat.Xml)]
????????[WebMethod]
????????public?XmlDocument?GetBookTitle()
????????{
????????????XmlDocument?xmlDoc?=?new?XmlDocument();
????????????xmlDoc.LoadXml(myXmlData);
????????????return?xmlDoc;
????????}
???????
????????///?<summary>
????????///?This?method?uses?HTTP-GET?protocol?to?call?it
????????///?</summary>
????????///?<returns></returns>
????????[ScriptMethod(UseHttpGet?=?true)]
????????[WebMethod]
????????public?string?HelloWorld()
????????{
????????????return?"Hello,?world";
????????}
????}
}
? 注:Web服務創建的ScriptService使用如上將不會被瀏覽器默認。您需要修改文件中的設置Web.config文件如下,以測試上述Web服務。 <webServices>
?????<protocols>
???????<add?name="HttpGet"/>?
???????<add?name="HttpPost"/>
????</protocols>
</webServices>
? 調用Web服務方法使用客戶端腳本,Asp.Net Web服務方法可以說是從客戶端腳本異步不回傳,并沒有刷新整個頁面。只有其之間傳輸數據的服務器和客戶端的瀏覽器。
目前,.NET 3.5框架支持Web服務和客戶端的網頁可以在相同的域(同一網站)。
現在增加一個新的“Ajax激活Web頁” ,以現有的Web服務項目并添加控件的網頁中指定的標記如下,編寫JavaScript函數調用Web服務和回調方法。調用Web服務方法 是通過使用代理類和參數列表,成功回調函數名,失敗的回調函數,用戶方面是通過額外的參數的要求調用。 <%@?Page??Language="C#"?AutoEventWireup="true"?CodeFile="Default.aspx.cs"?Inherits="AjaxWebService.Default"?%>
<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html?xmlns="http://www.w3.org/1999/xhtml">
<head?runat="server">
????<title>AJAX?Web?Form</title>
????<script?type="text/javascript">
function?CallNextDate()?
????{
????????AjaxWebService.Service.getNextBackupDate(1,?OnSucceeded);
????}
????function?CallHelloWorld()?
????{
????????AjaxWebService.Service.HelloWorld(OnSucceeded);
????}
???function?CallBookTitle()?
????{
????????AjaxWebService.Service.GetBookTitle(OnSuccess,?OnFail,?"XmlDocument");
????}
????
????//?This?is?the?callback?function?that?processes?the?Web?Service?return?value?in?JSON?format.
????function?OnSucceeded(result)
????{
????????var?myresult?=?document.getElementById("Text1");
????????myresult.value?=?result;
????}
????
???//?This?is?the?callback?function?that?processes?the?Web?Service?return?value?in?XML?format.
????function?OnSuccess(result)
????{
????????var?myresult?=?document.getElementById("Text1");
????????myresult.value?=?"Title:?"?+?result.documentElement.text;
????}
????
???//?This?is?the?callback?function?that?processes?the?Web?Service?return?value?in?XML?format.
????function?OnFail(error)
????{
????????var?myresult?=?document.getElementById("Text1");
????????myresult.value?=?"Service?Error:?"?+?error.get_message();
????} ?????</script>
??
????<style?type="text/css">
????????#Text1
????????{
????????????width:?375px;
????????}
????????#Button2
????????{
????????????width:?140px;
????????}
????</style>
??
</head>
<body>
????<form?id="form1"?runat="server">
????<div>
????????<asp:ScriptManager?ID="ScriptManager1"?runat="server">
????????<Services>
????????<asp:ServiceReference?Path="~/Service.asmx"/>
????????</Services>
????????</asp:ScriptManager>
????????<br?/>
????????Result: ?????????<input?id="Text1"?type="text"?/><br?/>
????????<br?/>
????????<input?id="Button1"?type="button"?value="Get?Server?Time"?onclick="CallNextDate()"?/>
????????<input?id="Button2"?type="button"?value="Say?Hello?World"?onclick="CallHelloWorld()"?/>
????????<input?id="Button3"?type="button"?value="Get?Book?Title"?onclick="CallBookTitle()"?/>
????????<br?/>
????????<br?/>
????????<br?/>
????????</div>
????</form>
</body>
</html>
? 在上面的標記,通知的路徑屬性如何在ServiceReference元素ScriptManager控制點到Web服務類。這使得Web服務方法被稱為從腳本中的default.aspx頁面。內嵌功能CallNextDate , CallHelloWorld , CallBookTitle是用來調用的三個Web服務方法。 OnSuccess和OnFail方法是回調方法,得到執行的Web服務的方法得到了執行。為了使客戶端的Web頁的正常工作,您需要添加以下設置的Web.config文件。 <runtime>
????<assemblyBinding?xmlns="urn:schemas-microsoft-com:asm.v1">
??????<dependentAssembly>
????????<assemblyIdentity?name="System.Web.Extensions"?publicKeyToken="31bf3856ad364e35"/>
????????<bindingRedirect?oldVersion="1.0.0.0-1.1.0.0"?newVersion="3.5.0.0"/>
??????</dependentAssembly>
??????<dependentAssembly>
????????<assemblyIdentity?name="System.Web.Extensions.Design"?publicKeyToken="31bf3856ad364e35"/>
????????<bindingRedirect?oldVersion="1.0.0.0-1.1.0.0"?newVersion="3.5.0.0"/>
??????</dependentAssembly>
????</assemblyBinding>
??</runtime>
本文使用微軟ASP.NET 3.5引用的System.Web.Extensions.dll等DLL,利用內置的ASP.NET3.5中的AJAX技術僅供學習人員參考。 參考代碼下載
? 為了使你的應用程序調用的ASP.NET Web service使用客戶端腳本,服務器異步通信層會自動生成的JavaScript代理類。代理類生成為每個Web服務的 一個<asp:ServiceReference>元素被列入<asp:ScriptManager>控制的頁面。
<asp:ScriptManager?runat="server"?ID="scriptManagerId">
?????<Services>
????????????<asp:ServiceReference??Path="WebService.asmx"?/>
?????</Services>
</asp:ScriptManager>
這是下載的代理類的瀏覽器在網頁加載時間,并提供了一個客戶端對象,代理調用方法的Web服務。在調用相應的方法所產生的JavaScript的代理類。該代理類打開通信與網絡服務。這些請求通過的XMLHTTP對象的瀏覽器異步通訊。? 如下圖所示,詳細規定了不同的層上的客戶機和服務器方面通訊框架。 <asp:ScriptReference>元素指定注冊一個JavaScript文件,用來在網頁中。只有在注冊CallWebServiceMethod.js文件,您才可以在方法上進行調用,調用Web服務方法的腳本是異步的。獲得返回值或以確定何時返回的請求,您必須提供一個成功的回調函數。回調函數被調用時,請求已成功完成,并且它包含的返回值(如果有的話)從Web方法調用。您也可以提供一個失敗的回調函數來處理錯誤。此外,您還可以通過用戶的背景資料,使用中的回調函數。 如下圖,是WCF和Ajax調用Web service時序圖。
???? 在上一篇文章(基于ASP.NET 3.5 Web Service 的JSON擴展應用)中已經講過,JSON - JavaScript對象符號是默認序列化格式,使用它進行數據轉換之間客戶端服務器請求。您可以禁用所有目前啟用的協議像HTTP-GET、HTTP-POST,甚至的XML格式的SOAP中使用的早期形式的Web服務。以下設置在Web.config文件同樣也是這樣使用。 <system.web>
????<webServices>
????????<protocols>
??????????<clear/>
????????</protocols>
??????</webServices>
</system.web>
? 請求一個Web服務方法通過這些層面。你可以看到如何使用一種方法,要求在一個可用的代理對象和Web請求中,并由一個XMLHttp對象在客戶端瀏覽器端運行。在服務器端,你的要求是與往常一樣是由一個HTTP處理程序,發出的XML/JSON序列化。 如下圖所示,asp.net 3.5調用Ajax與Web服務的類關系圖。
在AJAX中使用Web服務方法包括兩個步驟:第一步是,創建和定義Web服務。第二個步,是使用客戶端腳本來從一個網頁的服務通話方法。創建一個Web服務: 在System.Web.Scripts.Services命名空間,你可能會發現一個屬性類“ScriptSrvice ”,這需要適用于Web服務類,使Web服務方法可以調用來自客戶端的腳本。這將使代理生成腳本來生成一個代理對象對應于Web服務類。 同樣,在相同的命名空間,可能會發現另一個屬性類“ScriptMethod”,如果采用此屬性為Web方法,你可以指定哪些HTTP動詞是用來調用一個方法和響應形式。此屬性有三個參數描述如下: UseHttpGet :如果設置為true,將調用該方法使用HTTP GET命令。默認值為false 。
????? ResponseFormat :指定是否反應將序列化的簡JSON或XML 。默認值為JSON。
????? XmlSerializeString :指定是否所有返回類型,包括字符串類型,是為XML序列化的值將被忽略XmlSerializeString連續的響應來系列化的JSON 。
? 現在,創建新的Web使用ASP.NET Web Service模板在Microsoft Visual Studio 2008和修改Web服務類如下: using?System.Web.Script.Services;
namespace?AjaxWebService
{
????[WebService(Namespace?=?"http://localhost:1382/AjaxWebService/")]
????[WebServiceBinding(ConformsTo?=?WsiProfiles.BasicProfile1_1)]
????[ScriptService]
????public?class?Service?:?System.Web.Services.WebService
????{
????????string?myXmlData?=?@"<?xml?version=""1.0""?encoding=""utf-8""??>
????????????????<Book>
????????????????????<Title>Programming?ASP.NET?3.5,?AJAX?and?Web?Services</Title>
????????????????</Book>";
???????
????????///?<summary>
????????///?This?method?uses?JSON?response?formatting?
????????///?</summary>
????????///?<param?name="months"></param>
????????///?<returns></returns>
????????[ScriptMethod(ResponseFormat?=?ResponseFormat.Json)]
????????[WebMethod]
????????public?string?getNextBackupDate(int?months)
????????{
????????????return?DateTime.Now.AddMonths(months).ToShortDateString();
????????}
????????
????????///?<summary>
????????///?This?method?uses?XML?response?formatting
????????///?</summary>
????????///?<returns></returns>
????????[ScriptMethod(ResponseFormat?=?ResponseFormat.Xml)]
????????[WebMethod]
????????public?XmlDocument?GetBookTitle()
????????{
????????????XmlDocument?xmlDoc?=?new?XmlDocument();
????????????xmlDoc.LoadXml(myXmlData);
????????????return?xmlDoc;
????????}
???????
????????///?<summary>
????????///?This?method?uses?HTTP-GET?protocol?to?call?it
????????///?</summary>
????????///?<returns></returns>
????????[ScriptMethod(UseHttpGet?=?true)]
????????[WebMethod]
????????public?string?HelloWorld()
????????{
????????????return?"Hello,?world";
????????}
????}
}
? 注:Web服務創建的ScriptService使用如上將不會被瀏覽器默認。您需要修改文件中的設置Web.config文件如下,以測試上述Web服務。 <webServices>
?????<protocols>
???????<add?name="HttpGet"/>?
???????<add?name="HttpPost"/>
????</protocols>
</webServices>
? 調用Web服務方法使用客戶端腳本,Asp.Net Web服務方法可以說是從客戶端腳本異步不回傳,并沒有刷新整個頁面。只有其之間傳輸數據的服務器和客戶端的瀏覽器。
目前,.NET 3.5框架支持Web服務和客戶端的網頁可以在相同的域(同一網站)。
現在增加一個新的“Ajax激活Web頁” ,以現有的Web服務項目并添加控件的網頁中指定的標記如下,編寫JavaScript函數調用Web服務和回調方法。調用Web服務方法 是通過使用代理類和參數列表,成功回調函數名,失敗的回調函數,用戶方面是通過額外的參數的要求調用。 <%@?Page??Language="C#"?AutoEventWireup="true"?CodeFile="Default.aspx.cs"?Inherits="AjaxWebService.Default"?%>
<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html?xmlns="http://www.w3.org/1999/xhtml">
<head?runat="server">
????<title>AJAX?Web?Form</title>
????<script?type="text/javascript">
function?CallNextDate()?
????{
????????AjaxWebService.Service.getNextBackupDate(1,?OnSucceeded);
????}
????function?CallHelloWorld()?
????{
????????AjaxWebService.Service.HelloWorld(OnSucceeded);
????}
???function?CallBookTitle()?
????{
????????AjaxWebService.Service.GetBookTitle(OnSuccess,?OnFail,?"XmlDocument");
????}
????
????//?This?is?the?callback?function?that?processes?the?Web?Service?return?value?in?JSON?format.
????function?OnSucceeded(result)
????{
????????var?myresult?=?document.getElementById("Text1");
????????myresult.value?=?result;
????}
????
???//?This?is?the?callback?function?that?processes?the?Web?Service?return?value?in?XML?format.
????function?OnSuccess(result)
????{
????????var?myresult?=?document.getElementById("Text1");
????????myresult.value?=?"Title:?"?+?result.documentElement.text;
????}
????
???//?This?is?the?callback?function?that?processes?the?Web?Service?return?value?in?XML?format.
????function?OnFail(error)
????{
????????var?myresult?=?document.getElementById("Text1");
????????myresult.value?=?"Service?Error:?"?+?error.get_message();
????} ?????</script>
??
????<style?type="text/css">
????????#Text1
????????{
????????????width:?375px;
????????}
????????#Button2
????????{
????????????width:?140px;
????????}
????</style>
??
</head>
<body>
????<form?id="form1"?runat="server">
????<div>
????????<asp:ScriptManager?ID="ScriptManager1"?runat="server">
????????<Services>
????????<asp:ServiceReference?Path="~/Service.asmx"/>
????????</Services>
????????</asp:ScriptManager>
????????<br?/>
????????Result: ?????????<input?id="Text1"?type="text"?/><br?/>
????????<br?/>
????????<input?id="Button1"?type="button"?value="Get?Server?Time"?onclick="CallNextDate()"?/>
????????<input?id="Button2"?type="button"?value="Say?Hello?World"?onclick="CallHelloWorld()"?/>
????????<input?id="Button3"?type="button"?value="Get?Book?Title"?onclick="CallBookTitle()"?/>
????????<br?/>
????????<br?/>
????????<br?/>
????????</div>
????</form>
</body>
</html>
? 在上面的標記,通知的路徑屬性如何在ServiceReference元素ScriptManager控制點到Web服務類。這使得Web服務方法被稱為從腳本中的default.aspx頁面。內嵌功能CallNextDate , CallHelloWorld , CallBookTitle是用來調用的三個Web服務方法。 OnSuccess和OnFail方法是回調方法,得到執行的Web服務的方法得到了執行。為了使客戶端的Web頁的正常工作,您需要添加以下設置的Web.config文件。 <runtime>
????<assemblyBinding?xmlns="urn:schemas-microsoft-com:asm.v1">
??????<dependentAssembly>
????????<assemblyIdentity?name="System.Web.Extensions"?publicKeyToken="31bf3856ad364e35"/>
????????<bindingRedirect?oldVersion="1.0.0.0-1.1.0.0"?newVersion="3.5.0.0"/>
??????</dependentAssembly>
??????<dependentAssembly>
????????<assemblyIdentity?name="System.Web.Extensions.Design"?publicKeyToken="31bf3856ad364e35"/>
????????<bindingRedirect?oldVersion="1.0.0.0-1.1.0.0"?newVersion="3.5.0.0"/>
??????</dependentAssembly>
????</assemblyBinding>
??</runtime>
本文使用微軟ASP.NET 3.5引用的System.Web.Extensions.dll等DLL,利用內置的ASP.NET3.5中的AJAX技術僅供學習人員參考。 參考代碼下載
轉載于:https://blog.51cto.com/xiaoyinnet/196073
總結
以上是生活随笔為你收集整理的使用ASP.Net 3.5 的Ajax与Web服务开发实例的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: WSE3.0构建Web服务安全(3):W
- 下一篇: 在LINUX环境中,哪种文件系统存储更安