如何創建一個Ajax-Enabled WCF Service

原創地址：http://www.survivalescaperooms.com/jfzhu/p/4041638.html

轉載請注明出處

前面的文章中介紹過《Step by Step 創建一個WCF Service 》以及《如何使用WCF的Trace與Message Log功能》，本文介紹如何創建一個AJAX-Enabled WCF Service。

（一）創建一個WCF AJAX-enabled service

1. 打開Visual Studio 2012，創建一個asp.net Empty Web application PRoject，命名為SandwichServices。這時Visual Studio的web.config文件內容為：

<?xml version="1.0"?><configuration>  <system.web>    <compilation debug="true" targetFramework="4.0" />  </system.web></configuration>

2. 添加一個AJAX-enabled WCF Service，命名為CostService.svc

using System.ServiceModel;using System.ServiceModel.Activation;namespace SandwichServices{    [ServiceContract(Namespace = "SandwichServices")]    [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]    public class CostService    {        // To use HTTP GET, add [WebGet] attribute. (Default ResponseFormat is WebMessageFormat.Json)        // To create an Operation that returns XML,        //     add [WebGet(ResponseFormat=WebMessageFormat.Xml)],        //     and include the following line in the operation body:        //         WebOperationContext.Current.OutgoingResponse.ContentType = "text/xml";        [OperationContract]        public void DoWork()        {            // Add your operation implementation here            return;        }            }}

因為我們不打算使用TCP等HTTP之外的Protocol，所以設置為AspNetCompatibilityEnabled。

3. 修改Namespace ServiceContractAttribute，并添加一個CostOfSandwiches方法

using System.ServiceModel;using System.ServiceModel.Activation;namespace SandwichServices{    [ServiceContract(Namespace = "SandwichServices")]    [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]    public class CostService    {        // To use HTTP GET, add [WebGet] attribute. (Default ResponseFormat is WebMessageFormat.Json)        // To create an operation that returns XML,        //     add [WebGet(ResponseFormat=WebMessageFormat.Xml)],        //     and include the following line in the operation body:        //         WebOperationContext.Current.OutgoingResponse.ContentType = "text/xml";        [OperationContract]        public void DoWork()        {            // Add your operation implementation here            return;        }        [OperationContract]        public double CostOfSandwiches(int quantity)        {            return 1.25 * quantity;        }    }}

4. 這時Visual Studio生成的web.config文件

<?xml version="1.0"?><configuration>  <system.web>    <compilation debug="true" targetFramework="4.0" />  </system.web>  <system.serviceModel>    <behaviors>      <endpointBehaviors>        <behavior name="SandwichServices.CostServiceAspNetAjaxBehavior">          <enableWebScript />        </behavior>      </endpointBehaviors>    </behaviors>    <serviceHostingEnvironment aspNetCompatibilityEnabled="true"        multipleSiteBindingsEnabled="true" />    <services>      <service name="SandwichServices.CostService">        <endpoint address="" behaviorConfiguration="SandwichServices.CostServiceAspNetAjaxBehavior"            binding="webHttpBinding" contract="SandwichServices.CostService" />      </service>    </services>  </system.serviceModel></configuration>

如果在瀏覽器中訪問CostService.svc，得到如下錯誤

5. 修改web.config文件

<?xml version="1.0"?><configuration>  <system.web>    <compilation debug="true" targetFramework="4.0" />  </system.web>  <system.serviceModel>    <behaviors>      <endpointBehaviors>        <behavior name="SandwichServices.CostServiceAspNetAjaxBehavior">          <enableWebScript />        </behavior>      </endpointBehaviors>      <serviceBehaviors>        <behavior name="SandwichServices.CostServiceServiceBehavior" >          <serviceMetadata httpGetEnabled="true" />        </behavior>      </serviceBehaviors>    </behaviors>    <serviceHostingEnvironment aspNetCompatibilityEnabled="true"        multipleSiteBindingsEnabled="true" />    <services>      <service name="SandwichServices.CostService" behaviorConfiguration="SandwichServices.CostServiceServiceBehavior">        <endpoint address="" behaviorConfiguration="SandwichServices.CostServiceAspNetAjaxBehavior"            binding="webHttpBinding" contract="SandwichServices.CostService" />        <endpoint contract="IMetadataExchange" binding="mexHttpBinding" address="mex" />      </service>    </services>  </system.serviceModel></configuration>

再次在瀏覽器中打開CostService.svc，可以正常訪問了。

（二）創建Client端，調用WCF Service

1. 創建一個aspx Page

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebClient.WebForm2" %><!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title></title>    <script language="javascript" type="text/Javascript">        function Button1_onclick() {            var service = new SandwichServices.CostService();            service.CostOfSandwiches(3, onSuccess, null, null);        }        function onSuccess(result) {            alert(result);        }    </script></head><body>    <form id="form1" runat="server">    <div>        <p>        <input id="Button1" type="button" value="Price for 3 Sandwiches" onclick="return Button1_onclick()" />        </p>    </div>        <asp:ScriptManager ID="ScriptManager1" runat="server">            <Services>                <asp:ServiceReference Path="http://192.168.6.47:8080/CostService.svc" />            </Services>        </asp:ScriptManager>    </form></body></html>

2. 在瀏覽器中打開該頁面，然后用F12工具可以看到加載進來的JavaScript，是WCF Service生成的。

Fiddler