开发环境：vs2010+.net 4.0+jquery.4.0
1、创建WCF服务
直接在网站中添加 Ajax-enabled-WCF Services ,命名为AjaxWcfServices.svc。在App_Code下生成AjaxWCFService.cs文件。
AjaxWCFService.cs代码如下：
在web.config中在添加ajax-enabled- WCF Services 的同时会自动生成如下配置：
<code>
<system.serviceModel>
<services>
<service name="AjaxWCFService">
<endpoint address="" behaviorConfiguration="AjaxWCFServiceAspNetAjaxBehavior"
binding="webHttpBinding" contract="AjaxWCFService" />
</service>
</services>
<behaviors>
<endpointBehaviors>
<behavior name="AjaxWCFServiceAspNetAjaxBehavior">
<enableWebScript />
</behavior>
</endpointBehaviors>
<serviceBehaviors>
<behavior name="">
<serviceMetadata httpGetEnabled="true" />
<serviceDebug includeExceptionDetailInFaults="false" />
</behavior>
</serviceBehaviors>
</behaviors>
<serviceHostingEnvironment aspNetCompatibilityEnabled="true"
multipleSiteBindingsEnabled="true" /></system.serviceModel>
</code>
默认生成的，不用更改什么。。 其中 <enableWebScript /> 这个表示wcf能被客户端js调用访问
2、现在主要设置运用jquery调用WCF服务 json对象
<!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">
<script src="JS/jquery-1.4.3.min.js" type="text/javascript"></script>
<title></title>
<style type="text/css">
#outPut {
width: 239px;
}
</style>
<script type="text/javascript">
$(function () {
$("#btnOK").click(function () {
//ajax operation
var name = $("#userName").val();
$.ajax({
url: "AjaxWCFService.svc/DoWork",
type: "get", // Get方式
contentType: "application/json;charset=utf-8", //WebService 会返回Json类型 必须加上
dataType: "json",
data: { "name": name }, //Get方式时的json格式数据参数方式
// data:'{"name":"'+name+'"}',//Post方式时的json格式参数，get方式访问时，代码不会报错，但是不会返回任何数据
success: function (result) {
var addr= result.d;
alert(addr);//返回数据
},
error: function (msg) {
alert(msg);
}
})
})
})
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<p>用户名：<input type="text" id="userName" /></p>
<p><input type="button" id="btnOK" value="查看结果" /></p>
</div>
</form>
</body>
</html>
在用Jquery ajax调用WCF服务传递json对象时，在分别用Post,get数据方式时，设置json参数格式时需要采用不同的格式类型。
Get类型：参数传递格式：{ "name": name }
Post类型：参数传递格式：'{"name":"'+name+'"}' 如果用Get类型那样传参会在Wcf接受的时候会提示json格式错误
在用Post类型提交时，相应的WCF服务 [WebGet()]修改成相应的 [WebInvoke()]，WCF默认传递格式为json,也可显示的添加为[WebGet(ResponseFormat=WebMessageFormat.Xml)]或者[WebInvoke(RequestFormat=WebMessageFormat.Xml)]
到此这就是利用Jquery ajax 用WCF服务传递Json对象的过程。
3、传递XML对象
这里在上面的AjaxWCFService.cs类中添加新类User类表示user实体
[DataContract]
public class User
{
[DataMember]
public string Name { get; set; }
[DataMember]
public string Age { get; set; }
[DataMember]
public string Addr { get; set; }
}
同样在AjaxWCFService类中添加GetUser方法，注意显示给出xml格式类型
[OperationContract]
[WebGet(ResponseFormat=WebMessageFormat.Xml)]//传递xml对象
public User GetUser(string name)
{
User user = new User();
user.Name = name;
user.Age = "18";
user.Addr = "sichuan of china";
return user;
}
相应的ajax,js更改为
<code>
$.ajax({
url: "AjaxWCFService.svc/GetUser",
type: "get",
dataType: "text/xml",
data: { "name": name }, //Get类型
success: function (result) {
var addr= $(result).find("Addr").text();//调用xml中Addr节点
alert(addr);
},
error: function (msg) {
alert(msg);
}
})
</code>
至此XML对象调用完成
在进行数据的get,post提交时，在传递json对象，在参数的传递写法上稍微有点不同。。否则会造成获取不到相应的数据格式类型。
在对Datetime类型Json序列化时，会生成“/Date(1298117607470+0800)/”格式。这是在js调用的时候需要对其格式话，因为json时间格式返回的是datetime类型和js中的datetime类型保持一直
所以可以用以下方式进行格式化
function FormartDate(data) {
var date = new Date(parseInt(data.replace("/Date(", "").replace(")/", ""), 10));
var y = date.getFullYear();
var m = date.getMonth() + 1;
var d = date.getDay()
var date = y + "-" + m + "-" + d;
return date;
}
在使用 [WebGet(ResponseFormat = WebMessageFormat.Json)] 对数据进行Json序列化的时候
返回的格式如：
{"d":{"__type":"Persion:#WcfService1","UserAge":20,"UserName":"张三","create":"//Date(1298117607470+0800)//"}}
如果在实体类中不采用 [DataContract]方式，而是[Serializable]方式，就不能得到以上的格式，所以在进行js调用返回的json数据时，实体类中不能用[Serializable]进行序列化，如果不加上面两关键字也能正常调用。但在WCF中，最好用DataContract作处理
如果是List类型，返回多条数据，则可以用
success: function (result) {
var data = result.d;
var str = "";
$(data).each(function (i) {
str += data[i].UserName + "," + data[i].UserAge + "," + FormartDate(data[i].create)+"<br />"
})
这种格式进行调用。。特此记录。