XmlAjaxService サンプルでは、Windows Communication Foundation (WCF) を使用して、JavaScript Object Notation (JSON) または XML データを返す非同期 JavaScript および XML (AJAX) サービスを作成する方法を示します。 Web ブラウザー クライアントから JavaScript コードを使用して AJAX サービスにアクセスできます。 このサンプルは 、Basic AJAX サービス のサンプルに基づいています。
他の AJAX サンプルとは異なり、このサンプルでは AJAX と ScriptManager コントロール ASP.NET 使用しません。 いくつかの追加構成では、WCF AJAX サービスに JavaScript を介して任意の HTML ページからアクセスできます。このシナリオを次に示します。 ASP.NET AJAX で WCF を使用する例については、 AJAX サンプルを参照してください。
このサンプルでは、JSON と XML の間で操作の応答の種類を切り替える方法を示します。 この機能は、サービスが AJAX または HTML/JavaScript クライアント ページ ASP.NET アクセスするように構成されているかどうかに関係なく使用できます。
注
このサンプルのセットアップ手順とビルド手順は、このトピックの最後にあります。
non-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 サービスを作成する」を参照してください。
次のサンプルのサービスは、2 つの操作を含む標準の WCF サービスです。 どちらの操作でも、Wrapped属性またはWebGetAttribute属性のWebInvokeAttribute本文スタイルが必要です。これは、webHttpの動作に固有であり、JSON/XML データ形式の切り替えには影響しません。
[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Xml, BodyStyle = WebMessageBodyStyle.Wrapped)]
MathResult DoMathXml(double n1, double n2);
操作の応答形式は XML として指定されます。これは、 <webHttp> 動作の既定の設定です。 ただし、応答形式を明示的に指定することをお勧めします。
もう 1 つの操作では、 WebInvokeAttribute 属性を使用し、応答に XML ではなく JSON を明示的に指定します。
[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Wrapped)]
MathResult DoMathJson(double n1, double n2);
どちらの場合も、操作は標準の WCF データ コントラクト型である複合型 MathResultを返します。
クライアント Web ページ XmlAjaxClientPage.htm には、前の 2 つの操作のいずれかを呼び出す JavaScript コードが含まれています。このコードは、ユーザーがページの [計算の実行 (JSON の返し)] ボタンまたは [計算の実行 (XML の戻り値)] ボタンをクリックしたときに発生します。 サービスを呼び出すコードは、JSON 本文を構築し、HTTP POST を使用して送信します。 要求は、 Basic AJAX サービス のサンプルや、ASP.NET AJAX を使用する他のサンプルとは異なり、JavaScript で手動で作成されます。
// 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 サンプル のOne-Time セットアップ手順を実行していることを確認します。
「Windows Communication Foundation サンプルのビルド」の説明に従って、XmlAjaxService.slnソリューションをビルドします。
http://localhost/ServiceModelSamples/XmlAjaxClientPage.htmに移動します (プロジェクト ディレクトリからブラウザーで XmlAjaxClientPage.htm を開かないでください)。