先日の記事では WCF サービスの利用方法を紹介しました。今回は Ajax 対応 WCF の利用方法を紹介します。
WebSite を用意し、ソリューションエクスプローラーから Web サイト名を右クリックします。「追加」→「新しい項目の追加」と進み、Visual Studio のテンプレートを表示します。一覧から WCF サービスを追加します。名前は「Service.svc」としています。
「Service.svc」を追加すると、自動的に「App_Code」フォルダ及びフォルダ内に「Service.cs」も生成されます。ここで生成された「Service.cs」の内部にサービスのロジックを実装していきます。
Service.cs
[ServiceContract(Namespace = "")]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class Service
{
// HTTP GET を使用するために [WebGet] 属性を追加します (既定の ResponseFormat は WebMessageFormat.Json)。
// XML を返す操作を作成するには、
// [WebGet(ResponseFormat=WebMessageFormat.Xml)] を追加し、
// 操作本文に次の行を含めます。
// WebOperationContext.Current.OutgoingResponse.ContentType = "text/xml";
[OperationContract]
public void DoWork()
{
// 操作の実装をここに追加してください
return;
}
// 追加の操作をここに追加して、[OperationContract] とマークしてください
// 下記2つの関数を追加
[OperationContract]
public string DoMyWork()
{
// 文字列を返す関数
return "DidMyWork";
}
[OperationContract]
public int DoMyWorkWithParam(int number)
{
// 計算結果を返す関数
return number * 50;
}
}
続いて Form 上に ScriptManager と HTML Button を配置します。
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<input id="Button1" type="button" value="button" />
</div>
</form>
Ajax WCF サービスは ScriptManager と連携して動作します。ScriptManager の Services コレクションに、先ほど作成した Service.svc を登録します。
ASPX のソースコードはこうなります。
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Services>
<asp:ServiceReference Path="Service.svc" />
</Services>
</asp:ScriptManager>
ここまでで WCF Ajax サービスの下準備が整いました。最後に HTML Button のクリックイベントに関数を登録し、非同期通信でサービスの呼び出しと結果を受け取ります。
<input id="Button1" type="button" value="button" onclick="callService()" />
登録した関数内に、サービスを呼び出す実装をします。
<script type="text/javascript">
function callService()
{
var service = new Service();
service.DoMyWork(onSuccess, null, null);
service.DoMyWorkWithParam(30, onSuccess, null, null)
}
function onSuccess(result) {
alert(result);
}
</script>
実行結果
ボタンをクリックすると、非同期通信でサービスから取得した値がダイアログ内に表示されます。すごく地味(^_^;)
サンプルは下記よりダウンロードできます。
WCF_Ajax.zip