含 JSON 和 XML 的 AJAX 服務範例
XmlAjaxService 範例會示範如何使用 Windows Communication Foundation (WCF) 建立會傳回 JavaScript 物件標記法 (JSON) 或 XML 資料的 Asynchronous JavaScript And XML (AJAX) 服務。 您可以從 Web 瀏覽器用戶端使用 JavaScript 程式碼存取 AJAX 服務。 此範例以 基本 AJAX 服務範例為建置基礎。
不像其他 AJAX 範例，這個範例不會使用 ASP.NET AJAX 以及 ScriptManager 控制項。 搭配一些額外組態時，便可透過 JavaScript 從任何 HTML 網頁存取 WCF AJAX 服務，以下即顯示此案例。 如需搭配 ASP.NET AJAX 使用 WCF 的範例，請參閱 AJAX 範例。
這個範例會示範如何從 JSON 和 XML 之間切換作業的回應型別。 不論是設定由 ASP.NET AJAX 或 HTML/JavaScript 用戶端頁面存取此服務，這項功能都會提供使用。
注意
此範例的安裝程序與建置指示位於本主題的結尾。
若要啟用非 ASP.NET AJAX 用戶端，請使用 .svc 檔案中的 WebServiceHostFactory (而非 WebScriptServiceHostFactory)。 WebServiceHostFactory 會將 WebHttpEndpoint 標準端點加入至服務。 此端點是在相對於 .svc 檔的空位址設定，這表示此服務的位址會是 http://localhost/ServiceModelSamples/service.svc，不含任何有別於作業名稱的其他後置字元。
<%@ServiceHost language="c#" Debug="true" Service="Microsoft.Samples.XmlAjaxService.CalculatorService" Factory="System.ServiceModel.Activation.WebServiceHostFactory" %>
Web.config 中的以下區段可用來針對端點進行其他組態變更。 如果不需要額外的變更，也可以加以移除。
<system.serviceModel>
<standardEndpoints>
<webHttpEndpoint>
<!-- Use this element to configure the endpoint -->
<standardEndpoint name="" />
</webHttpEndpoint>
</standardEndpoints>
</system.serviceModel>
WebHttpEndpoint 的預設資料格式為 XML，而 WebScriptEndpoint 的預設資料格式為 JSON。 如需詳細資訊，請參閱建立不含 ASP.NET 的 WCF AJAX 服務。
下列範例中的服務是包含兩種作業的標準 WCF 服務。 這兩種作業的 Wrapped 或 WebGetAttribute 屬性上都必須是 WebInvokeAttribute 本文樣式，這是 webHttp 行為的特定需求，而且不會影響 JSON/XML 資料格式切換。
[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Xml, BodyStyle = WebMessageBodyStyle.Wrapped)]
MathResult DoMathXml(double n1, double n2);
作業的回應格式會指定為 XML，這是 <webHttp> 行為的預設值。 然而，明確指定回應格式是較好的做法。
其他作業會使用 WebInvokeAttribute 屬性，並且明確地指定回應型別為 JSON 而不是 XML。
[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Wrapped)]
MathResult DoMathJson(double n1, double n2);
請注意，在這兩種情況中，作業都會傳回屬於標準 WCF 資料合約型別的複雜型別 MathResult。
用戶端網頁 XmlAjaxClientPage.htm 包含的 JavaScript 程式碼，會在使用者按一下該頁上的 [執行計算 (傳回 JSON)] 或 [執行計算 (傳回 XML)] 按鈕時叫用前述兩種作業的其中一種作業。 叫用此服務的程式碼會建構 JSON 本文，然後使用 HTTP POST 加以傳送。 此要求是使用 JavaScript 手動建立的，這點不同於基本 AJAX 服務範例以及使用 ASP.NET AJAX 的其他範例。
// Create HTTP request
var xmlHttp;
// Request instantiation code omitted…
// Result handler code omitted…
// Build the operation URL
var url = "service.svc/ajaxEndpoint/";
url = url + operation;
// Build the body of the JSON message
var body = '{"n1":';
body = body + document.getElementById("num1").value + ',"n2":';
body = body + document.getElementById("num2").value + '}';
// Send the HTTP request
xmlHttp.open("POST", url, true);
xmlHttp.setRequestHeader("Content-type", "application/json");
xmlHttp.send(body);
當服務回應時，回應會不經任何處理地顯示在頁面的文字方塊中。 這麼做是為了示範，以便您可直接觀察所使用的 XML 和 JSON 資料格式。
// Create result handler
xmlHttp.onreadystatechange=function(){
if(xmlHttp.readyState == 4){
document.getElementById("result").value = xmlHttp.responseText;
}
}
若要安裝、建置及執行範例
依照建置 Windows Communication Foundation 範例中所述，建置解決方案 XmlAjaxService.sln。
瀏覽至
http://localhost/ServiceModelSamples/XmlAjaxClientPage.htm(請勿使用瀏覽器從專案目錄開啟 XmlAjaxClientPage.htm)。