複合型を使用した AJAX サービスのサンプル

Download sample

このサンプルでは、Windows Communication Foundation (WCF) を使用して、複合型のインスタンスを作成し、そのインスタンスをサービスとクライアント間で JSON (JavaScript Object Notation) として送信する ASP.NET AJAX (Asynchronous JavaScript and XML) サービスを作成する方法を示します。AJAX サービスには、Web ブラウザ クライアントから JavaScript コードを使用してアクセスできます。このサンプルは、「基本的な AJAX サービス」のサンプルに基づいています。

Noteメモ :

このサンプルをビルドして実行するには、.NET Framework Version 3.5 をインストールする必要があります。Visual Studio 2008 では、プロジェクト ファイルとソリューション ファイルを開く必要があります。

WCF での AJAX サポートは、ScriptManager コントロールを介して ASP.NET AJAX と共に使用できるように最適化されています。ASP.NET AJAX と共に WCF を使用する例については、「AJAX のサンプル」を参照してください。

Noteメモ :

このサンプルのセットアップ手順とビルド手順については、このトピックの最後を参照してください。

次に示すサンプルのサービスは、AJAX 固有のコードを持たない WCF サービスです。WebGetAttribute 属性は適用されないため、既定の HTTP 動詞 ("POST") が使用されます。サービスには 1 つの DoMath 操作があります。この操作は、MathResult という名前の複合型を返します。複合型は標準のデータ コントラクト型で、AJAX 固有のコードも含まれていません。

[DataContract]
    public class MathResult
    {
        [DataMember]
        public double sum;
        [DataMember]
        public double difference;
        [DataMember]
        public double product;
        [DataMember]
        public double quotient;
    }

WebHttpBinding 標準バインディングとサービス構成内の <enableWebScript> 動作を使用して、サービスに AJAX エンドポイントを作成します。これは、基本的な AJAX サービス サンプルと同様です。

クライアント Web ページ ComplexTypeClientPage.aspx には、ユーザーがページの [Perform calculation] ボタンをクリックしたときにサービスを呼び出す ASP.NET および JavaScript コードが含まれています。サービスを呼び出すコードは、JSON 本文を作成し、HTTP POST を使用して送信します。これは、HTTP POST を使用する AJAX サービス サンプルと同様です。

サービス呼び出しに成功したら、生成された JavaScript オブジェクトのそれぞれのデータ メンバ (sum、difference、product、および quotient) にアクセスできます。

function onSuccess(mathResult){
     document.getElementById("sum").value = mathResult.sum;
     document.getElementById("difference").value = mathResult.difference;
     document.getElementById("product").value = mathResult.product;
     document.getElementById("quotient").value = mathResult.quotient;
}

サンプルを設定、ビルド、および実行するには

  1. 「Windows Communication Foundation サンプルの 1 回限りのセットアップの手順」が実行済みであることを確認します。

  2. 「Windows Communication Foundation サンプルのビルド」で説明されているように、ソリューション ComplexTypeAjaxService.sln をビルドします。

  3. https://localhost/ServiceModelSamples/ComplexTypeClientPage.aspx に移動します (プロジェクト ディレクトリからブラウザで ComplexTypeClientPage.aspx を開かないでください)。

関連項目

その他の技術情報

基本的な AJAX サービス

Footer image

Copyright © 2007 by Microsoft Corporation.All rights reserved.

  • Last updated on