這次帶給大家jQuery ajax呼叫WCF服務步驟詳解,jQuery ajax調用WCF服務的注意事項有哪些,下面就是實戰案例,一起來看一下。
本文實例講述了jQuery實作ajax呼叫WCF服務的方法。分享給大家供大家參考,具體如下:
關於AJAX呼叫WCF服務分為跨域與不跨域兩種方式,今天咱們先介紹下不跨域下的呼叫方法。 DEMO是在VS2008寫的.
經過測試與研究,發現AJAX調用WCF服務必須滿足以下條件
1.wcf的通訊方式必須使用webHttpBinding
2.必須設定< ;endpointBehaviors>節點的值
3.服務的實作必須新增標記
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
4.方法前面必須加入如下標記
[WebInvoke(Method = "POST", BodyStyle = WebMessageBodyStyle.Bare, ResponseFormat = WebMessageFormat.Json)]
5.ajax方法中傳遞的參數名稱必須和wcf服務中提供的參數方法名稱一致
以下是本人寫的程式碼,標記顏色的是需要注意的地方
伺服器端設定檔程式碼
84885eed1b30b261c5cb79484b41857f 9c020ba5b5829ca56c307612e71824b9 7af72fde0425263f6225f34d11d8be49 6eee7f5eeb23b28f25b647b835277888 899ce863166bff869e9b3ac68a2abfcdbce49a4f38d6cdd67362210863eac83d be0a8158e3152d2b14f2ed7522c8bc1b f7e6dec31ab1a0471d06c55afaca8d77 e7570860ff43afa4e8fe5ee4ff7b4037 5150410d5ae86a9aca86e39dba09763e fa66bbfdbebbb6577eb3ef9be72f23ed aae1c58f530f9c5ba604cee69fb0f991 07aad2482592b0629b89dc8fa8f9c2a7 bf86d273c03a30aed53d23f25c36971a 916007fd9688fe14d08e356f35512ffa 2d335b4e8bd5e457257c0f13e71684bc 6c4da2614f0b2a127b823cfc6a44c0d6 f6d76b94f29620466291ee3eb341a02b 585a217627162a5737a3a01f3709aba3 0419a42e71e1c09b795a9222aa041d03 6ed898c0d9e76a35ed2d31b28e3e3069 f734f6031f80298e381163a7dfb9d20b 6561d4bb80871abf40ca480f0a6b744f 32bcd8fda1beba957eb36b998b6a6c69 f351c1019e07b6e953a97397da23e9b1 65e2eede2048ddef4398c4604ef3b1ef f734f6031f80298e381163a7dfb9d20b acc36b2e4f9d6cee49b7d135db43f75c 1d19725e017e18860613f450a717754b 196c529656d77e626e143ff3bd83d11b
伺服器端程式碼
[ServiceContract] public interface IService1 { [OperationContract] string GetData(int value); [OperationContract] City GetDataUsingDataContract(City composite); [OperationContract] List6c132ff3bb7a6c407d7ed87f2557a5a4 GetList(); [OperationContract] List6c132ff3bb7a6c407d7ed87f2557a5a4 GetListData(List6c132ff3bb7a6c407d7ed87f2557a5a4 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; } } }
實作程式碼
[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 List6c132ff3bb7a6c407d7ed87f2557a5a4 GetList() { List6c132ff3bb7a6c407d7ed87f2557a5a4 list = new List6c132ff3bb7a6c407d7ed87f2557a5a4(); 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 List6c132ff3bb7a6c407d7ed87f2557a5a4 GetListData(List6c132ff3bb7a6c407d7ed87f2557a5a4 list) { return list; } #endregion }
客戶端呼叫程式碼
808c317fcb69cc1c8a796cf2f94d8f62 b585974ae3b7dba3039af53a9593f9c4 9edbc9f8a17547b211646280ef16fe6e 22e6244c9f89e2a72231546ed5a2733f b2386ffb911b14667cb8f0f91ea547a76e916e0f7d1e588d4f442bf645aedb2f 7415a4b80a7d8596d2716ae7bf1e0e2f2cacc6d41bbb37262a98f745aa00fbf0 8019067d09615e43c7904885b5246f0a //参数为整数的方法 function fn1() { $.ajax({ url: "http://localhost:12079/Service1.svc/GetData", type: "POST", contentType: "text/json", data: '{"value":2}', dataType: "json", success: function(returnValue) { alert(returnValue); }, error: function() { alert('error'); } }); } //参数为实体类的方法 function fn2() { $.ajax({ url: "http://localhost:12079/Service1.svc/GetDataUsingDataContract", type: "POST", contentType: "application/json", data: '{"CityID":1,"CityName":"北京","Seq":"3"}', dataType: "json", success: function(returnValue) { alert(returnValue.CityID + ' ' + returnValue.CityName + "--" + returnValue.Seq); }, error: function() { alert('error'); } }); } //返回值为类集合的方法 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 + ' ' + returnValue[i].CityName+'---'+returnValue[i].Seq); } }, error: function() { alert('error'); } }); } function fn4() { $.ajax({ url: "http://localhost:12079/Service1.svc/GetListData", type: "POST", contentType: "application/json", data: '[{"CityID":1,"CityName":"北京","Seq":"3"},{"CityID":3,"CityName":"上海","Seq":"3"}]', dataType: "json", success: function(returnValue) { for (var i = 0; i < returnValue.length; i++) { alert(returnValue[i].CityID + ' ' + returnValue[i].CityName + '---' + returnValue[i].Seq); } }, error: function() { alert('error'); } }); } 2cacc6d41bbb37262a98f745aa00fbf0 9c3bca370b5104690d9ef395f2c5f8d1 6c04bd5ca3fcae76e30b72ad730ca86d a56165225b53ae2239a99091f5fba8ce e388a4556c0f65e1904146cc1a846bee 18907f9727f75b914a50dae593b7604594b3e26ee717c64999d7867364b1b4a3 3e3815dbfe676f4c0d8ab9a0f4283079 ff9d32c555bb1d9133a29eb4371c1213 9b7263d24baad11335c1e31fb2807a76f5a47148e367a6035fd7a2faa965022e ff9d32c555bb1d9133a29eb4371c1213 61252de88165b46ea94f2085a508de08 36cc49f0c466276486e50c850b7e4956 73a6ac4ed44ffec12cee46588e518a5e
相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
推薦閱讀:
#以上是jQuery+ajax呼叫WCF服務步驟詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!