Einführung in die Implementierung von Ajax durch jQuery zum Aufrufen von WCF-Diensten

In diesem Artikel wird hauptsächlich die Methode von jQuery zur Implementierung von Ajax zum Aufrufen von WCF-Diensten vorgestellt. Er analysiert den Ajax-Frontend-Aufruf und den interaktiven Hintergrundaufruf von WCF-Diensten in Form eines vollständigen Beispiels Download. Freunde, die es brauchen Sie können sich auf Folgendes beziehen

Das Beispiel dieses Artikels beschreibt, wie jQuery Ajax implementiert, um WCF-Dienste aufzurufen. Ich teile es Ihnen als Referenz mit:

In Bezug auf AJAX-Aufrufe von WCF-Diensten gibt es zwei Methoden: domänenübergreifend und nicht domänenübergreifend. Heute werden wir zunächst die nicht-domänenübergreifenden Methoden vorstellen. domänenübergreifende Aufrufmethode. DEMO wurde in VS2008 geschrieben.

Nach Tests und Recherchen wurde festgestellt, dass der AJAX-Aufruf des WCF-Dienstes die folgenden Bedingungen erfüllen muss:

1 Die Kommunikationsmethode von WCF muss webHttpBinding verwenden
2 . Muss festgelegt werden: Der Wert des Knotens
3. Die Implementierung des Dienstes muss das Tag

[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]

4 hinzufügen

[WebInvoke(Method = "POST", BodyStyle = WebMessageBodyStyle.Bare, ResponseFormat = WebMessageFormat.Json)]

5. Der in der Ajax-Methode übergebene Parametername muss mit dem übereinstimmen. Die im WCF-Dienst bereitgestellten Parametermethodennamen sind konsistent.

Das Folgende ist der von mir geschriebene Code Orte, die Aufmerksamkeit erfordern

Serverseitiger Konfigurationsdateicode

<system.serviceModel> 
  <services> 
   <service name="WcfServiceDemoOne.Service1" behaviorConfiguration="WcfServiceDemoOne.Service1Behavior"> 
    <!-- Service Endpoints --> 
  <endpoint address="" binding="webHttpBinding" contract="WcfServiceDemoOne.IService1" behaviorConfiguration="HttpBehavior"></endpoint> 
    <endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange"/> 
    <host> 
     <baseAddresses> 
      <add baseAddress="http://localhost:12079/Service1.svc"/> 
     </baseAddresses> 
    </host> 
   </service> 
  </services> 
  <behaviors> 
   <serviceBehaviors> 
    <behavior name="WcfServiceDemoOne.Service1Behavior"> 
     <!-- 为避免泄漏元数据信息，请在部署前将以下值设置为 false 并删除上面的元数据终结点--> 
     <serviceMetadata httpGetEnabled="true"/> 
     <!-- 要接收故障异常详细信息以进行调试，请将以下值设置为 true。在部署前设置为 false 以避免泄漏异常信息--> 
     <serviceDebug includeExceptionDetailInFaults="false"/> 
    </behavior> 
   </serviceBehaviors> 
  <endpointBehaviors> 
  <behavior name="HttpBehavior"> 
   <webHttp/> 
  </behavior> 
  </endpointBehaviors> 
  </behaviors> 
</system.serviceModel>

Serverseitiger Code

[ServiceContract] 
 public interface IService1 
 { 
  [OperationContract] 
  string GetData(int value); 
  [OperationContract] 
  City GetDataUsingDataContract(City composite); 
   [OperationContract] 
  List<City> GetList(); 
   [OperationContract] 
  List<City> GetListData(List<City> list); 
 } 
 // 使用下面示例中说明的数据约定将复合类型添加到服务操作。 
 [DataContract] 
 public class City 
 { 
  int seq = 0; 
  string cityID; 
  string ctiyName; 
   [DataMember] 
  public string CityID 
  { 
   get 
   { 
    return cityID; 
   } 
   set 
   { 
    cityID=value; 
   } 
  } 
  [DataMember] 
  public string CityName 
  { 
   get { return ctiyName; } 
   set { ctiyName = value; } 
  } 
  [DataMember] 
  public int Seq 
  { 
   get 
   { return seq; } 
   set 
   { seq = value; } 
  } 
}

Implementierungscode

[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)] 
 public class Service1 : IService1 
 { 
  [WebInvoke(Method = "POST", BodyStyle = WebMessageBodyStyle.WrappedRequest, RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)] 
  public string GetData(int value) 
  { 
   return string.Format("You entered: {0}", value); 
  } 
  #region IService1 成员 
  [WebInvoke(Method = "POST", BodyStyle = WebMessageBodyStyle.Bare, ResponseFormat = WebMessageFormat.Json)] 
  public City GetDataUsingDataContract(City composite) 
  { 
   City c = new City(); 
   c.CityID = composite.CityID; 
   c.CityName = composite.CityName; 
   c.Seq = composite.Seq; 
   return c; 
  } 
  [WebInvoke(Method = "POST", BodyStyle = WebMessageBodyStyle.Bare, ResponseFormat = WebMessageFormat.Json)] 
  public List GetList() 
  { 
   List list = new List(); 
   City cc = new City(); 
   cc.CityID = "1"; 
   cc.CityName="北京"; 
   cc.Seq = 3; 
   list.Add(cc); 
   City cc1 = new City(); 
   cc1.CityID = "2"; 
   cc1.CityName = "上海"; 
   cc1.Seq = 4; 
   list.Add(cc1); 
   return list; 
  } 
  [WebInvoke(Method = "POST", BodyStyle = WebMessageBodyStyle.Bare, ResponseFormat = WebMessageFormat.Json)] 
  public List GetListData(List list) 
  { 
   return list; 
  } 
  #endregion 
}

Client-Anrufcode

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WcfServiceDemoOne.WebForm1" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
 <title></title> 
 <script src="jquery-1.7.1.min.js" type="text/javascript"></script> 
 <script type="text/javascript"> 
 //参数为整数的方法 
  function fn1() 
  { 
   $.ajax({ 
   url: "http://localhost:12079/Service1.svc/GetData", 
    type: "POST", 
    contentType: "text/json", 
    data: &#39;{"value":2}&#39;, 
    dataType: "json", 
    success: function(returnValue) { 
     alert(returnValue); 
    }, 
    error: function() { 
     alert(&#39;error&#39;); 
    } 
   }); 
  } 
//参数为实体类的方法 
  function fn2() { 
   $.ajax({ 
   url: "http://localhost:12079/Service1.svc/GetDataUsingDataContract", 
    type: "POST", 
    contentType: "application/json", 
    data: &#39;{"CityID":1,"CityName":"北京","Seq":"3"}&#39;, 
    dataType: "json", 
    success: function(returnValue) { 
    alert(returnValue.CityID + &#39; &#39; + returnValue.CityName + "--" + returnValue.Seq); 
    }, 
    error: function() { 
     alert(&#39;error&#39;); 
    } 
   }); 
  } 
//返回值为类集合的方法 
  function fn3() { 
   $.ajax({ 
    url: "http://localhost:12079/Service1.svc/GetList", 
    type: "POST", 
    contentType: "application/json", 
    dataType: "json", 
    success: function(returnValue) { 
    for (var i = 0; i < returnValue.length; i++) { 
     alert(returnValue[i].CityID + &#39; &#39; + returnValue[i].CityName+&#39;---&#39;+returnValue[i].Seq); 
     } 
    }, 
    error: function() { 
     alert(&#39;error&#39;); 
    } 
   }); 
  } 
  function fn4() { 
   $.ajax({ 
   url: "http://localhost:12079/Service1.svc/GetListData", 
    type: "POST", 
    contentType: "application/json", 
    data: &#39;[{"CityID":1,"CityName":"北京","Seq":"3"},{"CityID":3,"CityName":"上海","Seq":"3"}]&#39;, 
    dataType: "json", 
    success: function(returnValue) { 
    for (var i = 0; i < returnValue.length; i++) { 
     alert(returnValue[i].CityID + &#39; &#39; + returnValue[i].CityName + &#39;---&#39; + returnValue[i].Seq); 
    } 
    }, 
    error: function() { 
     alert(&#39;error&#39;); 
    } 
   }); 
  } 
 </script> 
</head> 
<body> 
 <form id="form1" runat="server"> 
 <p> 
  <input id="Button1" type="button" value="调用1" onclick="fn1();" /></p> 
  <input id="Button2" type="button" value="调用2" onclick="fn2();" /> 
  <br /> 
 <input id="Button3" type="button" value="调用3" onclick="fn3();" /></form> 
 <br /> 
 <input id="Button4" type="button" value="调用4" onclick="fn4();"/> 
</body> 
</html>

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, dass er für das Lernen aller hilfreich ist. Weitere verwandte Inhalte finden Sie im PHP Chinese Net.

Verwandte Empfehlungen:

Implementierung des mehrstufigen Akkordeonmenüs von jQuery

jquery$.ajax()-Methode

Das obige ist der detaillierte Inhalt vonEinführung in die Implementierung von Ajax durch jQuery zum Aufrufen von WCF-Diensten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!