[ASP.NET AJAX]如何使用 JavaScript 呼叫 WebService

2009-02-03

26301
0
ASP.NET AJAX
2009-02-04

摘要:[ASP.NET AJAX]如何使用 JavaScript 呼叫 WebService

本文使用 JavaScript 呼叫 WebService 的方式來實現非同步機制，也就是說使用 JavaScript 呼叫 WebService 的函式(C#/VB)，使其不會刷新網頁，將結果更新於網頁上。

在實作過程中有幾點注意事項：
1. WebService 類別必需加上屬性：[System.Web.Script.Services.ScriptService] 來指出這個 WebService 可由 JavaScript 呼叫
2. 方法必需要加上 [System.Web.Services.WebMethod]屬性。
3. 在 ScriptManager(ToolkitScriptManager) 控制項的 Services 集合屬性中加入指定要呼叫 WebService 的位置參考
<asp:ScriptManager ID="ScriptManager1" runat="server" > <Services> <asp:ServiceReference Path="WebService1.asmx" /> </Services> </asp:ScriptManager> 也可 Page_Load 以程式碼加入 protected void Page_Load(object sender, EventArgs e) { ScriptManager1.Services.Add(new ServiceReference("WebService1.asmx")); }
4. JavaScript 使用 WebService 類別名稱呼叫 WebService 函式。
<WebService Namespace>.<WebService ClassName>.<WebService MethodName(param..., Success, fail, userContext)>
Success, fail, userContext 三個參數為選擇性的
5. 預設傳輸行為模式為：使用 HTTP POST 命令呼叫，而且回應資訊將序列化為 JSON 傳回。

WebService(C#)
namespace WebApplication1 { [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [System.ComponentModel.ToolboxItem(false)] // 若要允許使用 ASP.NET AJAX 從指令碼呼叫此 Web 服務，請取消註解下一行。 [System.Web.Script.Services.ScriptService] public class WebService1 : System.Web.Services.WebService { [WebMethod] public string GetServerTime(string format) { return DateTime.Now.ToString(format); } } }

JavaScript
<script type="text/javascript"> $(function() { $("#Button1").click(function() { WebApplication1.WebService1.GetServerTime("yyyy/MM/dd HH:mm:ss", onSuccess, onError, $("#TextBox1")); return false; }); // 成功時更新文字方塊 function onSuccess(receiveData, userContext, methodName) { userContext.val(receiveData); } // 失敗時彈出失敗訊息 function onError(error, userContext, methodName) { if (error != null) alert(error.get_message()); } }); </script>

運作方式
當 ScriptManager 或 ToolkitScriptManager 控制項發現 Services 屬性集合中有 WebService 的位置參考時，
  會將此 WebService 類別轉換為可供 Client 呼叫的 JavaScript，
  而這一份 JavaScript 會存在於 http://(host)/WebService1.asmx/jsdebug 這個位置，
  然後 Web 網頁再用 Include 的方式鉗入。
  <script src="WebService1.asmx/jsdebug" type="text/javascript"></script>

了解限制
  1. 此 WebService 必須是以 ASP.NET 所建立
  2. XMLHttpRequest 不允許跨網域呼叫的問題
解決方式
    自已建立一個 WebService，在這個 WebService 再連結外部的 WebSerice

此程式範例介面與前面介紹的 PageMethods 相同
其他處理方式可參閱下面連結，處理方式幾乎一樣

[ASP.NET AJAX]如何使用 PageMethods 實現非同步機制(三)-改變傳輸模式

[ASP.NET AJAX]如何使用 PageMethods 實現非同步機制(二)-集中式管理

ASP.NET AJAX

回首頁