在网络上经常看到一些初学者提问怎么在AJAX中或用Javascript调用WCF服务,本文将简要给初学者介绍如何在AJAX中或用Javascript调用WCF服务以及注意事项。为了便于讲解,我们首先创建一个WCF服务,服务和服务数据定义如下:
//数据契约 [DataContract] public class Person { [DataMember] public int ID { get; set; } [DataMember]
public string Name
{ get; set; } } //WCF服务,为了能使js调用,
必须设置AspNetCompatibilityRequirements为Allowed或Required [ServiceContract(Namespace = "")]
[AspNetCompatibilityRequirements
(RequirementsMode =
AspNetCompatibilityRequirementsMode.Allowed)] public class PersonService { //服务功能1
[OperationContract] [WebGet] public
Person GetOnePerson()
{ return new Person { ID = 1, Name = "cokkiy" }; } //服务功能2 [OperationContract] [WebGet]
public List<Person> GetPorsons
(int id, string name) {
return new List<Person>() { new Person { ID=1,Name="cokkiy"}, new Person { ID=id,Name=name}
}; } }
Ok,我们先看一下服务定义,为了使AJAX或JS调用服务,必须标记服务的AspNet兼容模式为Allowed或Required。其次,操作契约必须标记为WebGet或WebInvoke,WebGet属性标记了一个可以用http
get方法调用的操作,而WebInvoke属性标记了一个可以用http post方法调用的操作。
再来看服务配置文件:
<system.serviceModel> <behaviors> <endpointBehaviors> <behavior name="AjaxWCFWeb.Services.
PersonServiceAspNetAjaxBehavior">
<enableWebScript/> </behavior>
</endpointBehaviors> </behaviors> <serviceHostingEnvironment aspNetCompatibilityEnabled=
"true"/> <services> <service name
="AjaxWCFWeb.Services.PersonService">
<endpoint address="" behaviorConfiguration="AjaxWCFWeb.Services.PersonServiceAspNetAjaxBehavior
" binding="webHttpBinding" contract="AjaxWCFWeb.Services.PersonService"/> </service> </services> </system.serviceModel>
这里注意,配置文件中,必须提供基于webHttpBinding的绑定,否则就不能从js中调用。并且,必须设置serviceHostingEnvironment 为aspNetCompatibilityEnabled。
下面来看如何在js中调用我们刚才创建的WCF服务,我们用JQuery的ajax功能。
<p> <button id="getOnePerson" type="button">Get One Person</button> <button id="getPersons"
type="button">Get Persons
</button> </p>
<script type="text/javascript"> $(document).ready(function() { $('#getOnePerson').click(function
() { $.getJSON
("/Services/PersonService.svc/GetOnePerson", {}, function(data) { alert("ID:" +data.d.ID +
" Name:" + data.d.Name); });
}); $('#getPersons').click(function() { $.getJSON("/Services/PersonService.svc/GetPorsons",
{ id: 100, name: "from clent" },
function(data) { alert(data.d.length); for (var i = 0; i < data.d.length; i++) { alert("ID:"
+ data.d[i].ID + " Name:" +
data.d[i].Name); } }); }); }); </script>
由于我们用的是JQuery的AJAX函数,因此调用方式非常简单,熟悉JQuery AJax的朋友一看就明白了,这种调用方式跟调用其他方法几乎完全一样,
差别在于返回的数据,请注意我们真正的数据在data.d中。
总结:1)WCF服务必须标记为AspNetCompatibilityRequirements为Alowed或Requered。
2)服务中的操作(Operation)必须标记为WebGet或WebInvoke。
3)服务配置中必须提供webHttpBinding绑定,并设置服务的运行环境为aspNetCompatibilityEnabled。
4)返回的数据在属性d中。
|