Jquery+JSON消費(fèi)REST WCF4.0 服務(wù)（帶源碼）

　　作為一種以HTTP協(xié)議為基礎(chǔ)的WCF 服務(wù)，只要客戶端能模擬進(jìn)行HTTP請(qǐng)求，都能成為服務(wù)的消費(fèi)者。之前寫過《對(duì)Jquery+JSON+WebService的一點(diǎn)認(rèn)識(shí)》，覺得在REST是基于HTTP協(xié)議的，AJAX的操作也應(yīng)該一樣。但是事實(shí)上還是有些差別的。由于網(wǎng)上資源聊聊無幾，因此記錄下自己的個(gè)人體會(huì)。希望對(duì)你有些幫助！
　　本篇主要講述的類容為在ASP.NET中，如何通過AJAX來消費(fèi)REST服務(wù)。
　　使用JQUERY框架模擬AJAX請(qǐng)求時(shí)，操作類型主要有GET、POST兩種。本節(jié)也以這兩種常用的方式來進(jìn)行介紹。（type (String) : (默認(rèn): "GET") 請(qǐng)求方式 ("POST" 或 "GET")， 默認(rèn)為 "GET"。注意：其它 HTTP 請(qǐng)求方法，如 PUT 和 DELETE 也可以使用，但僅部分瀏覽器支持。摘自：Jquery 1.4 API手冊(cè)）。

• 本篇主要涉及的操作如下：

• 1、GET請(qǐng)求
• 2、POST請(qǐng)求，簡(jiǎn)單數(shù)據(jù)類型
• 3、POST請(qǐng)求，復(fù)雜數(shù)據(jù)類型

　　Jq+JSON消費(fèi)REST WCF4.0 服務(wù)時(shí)，對(duì)返回給客戶端數(shù)據(jù)格式，以及客戶端傳遞給服務(wù)端數(shù)據(jù)格式是通過ResponseFormat、RequestFormat 兩個(gè)枚舉類型的指定的。如下代碼所示。

服務(wù)端實(shí)現(xiàn)代碼：

public class AjaxService
{
　　　　[WebGet(UriTemplate = "/{id}"
　　　　,ResponseFormat =WebMessageFormat.Json
　　　　, RequestFormat = WebMessageFormat.Json)]
　　　　public Person GetPerson(string id)
　　　　{
　　　　return new Person
　　　　{
　　　　　　Id = int.Parse(id), 
　　　　　　Age = 27, 
　　　　　　Name = "zhansan", 
　　　　　　Phone = "01082667896"
　　　　};
　　}

　　[WebInvoke(UriTemplate = "/Post"
　　, BodyStyle = WebMessageBodyStyle.WrappedRequest
　　, ResponseFormat = WebMessageFormat.Json
　　, RequestFormat = WebMessageFormat.Json)]
　　public string UpdatePerson(Person person)
　　{
　　　　return person.Id + person.Name + person.Age + person.Phone;
　　}

　　[WebInvoke(UriTemplate = "/Rest/Post"
　　, BodyStyle = WebMessageBodyStyle.WrappedRequest
　　, ResponseFormat = WebMessageFormat.Json
　　, RequestFormat = WebMessageFormat.Json)]
　　public string Update(string message)
　　{
　　　　return string.Concat("hello", message);
　　}
}

客戶端實(shí)現(xiàn)代碼
1、GET請(qǐng)求。

$.ajax({
type: "get",
url: "AjaxService/36",
contentType: "application/json; charset=utf-8",
success: function (json) { alert(json.Name) },
error: function (error) {
alert("調(diào)用出錯(cuò)" + error.responseText);
}
});

　　效果如下圖：

2、POST請(qǐng)求，簡(jiǎn)單數(shù)據(jù)類型。

var jsonMsg = { 'message': 'zhangsan' };
var message = JSON2.stringify(jsonMsg)
$.ajax({
　　　　type: "POST",
　　　　url: "AjaxService/Rest/Post",
　　　　contentType: "application/json",
　　　　data: message,
　　　　dataType: "text",
　　　　processData: false,
　　　　success: function (json) { alert(json) },
　　　　error: function (error) {
　　　　alert("調(diào)用出錯(cuò)" + error.responseText);
　　}
});

　　運(yùn)行結(jié)果如下圖：

3、POST請(qǐng)求，復(fù)雜數(shù)據(jù)類型
　　POST復(fù)雜數(shù)據(jù)類型與簡(jiǎn)單類型原理是一樣的。在Web頁(yè)面建構(gòu)JSON數(shù)據(jù)對(duì)象，然后將其轉(zhuǎn)換為JSON的字符串格式。
代碼如下：

var jsonData = { 'person': { 'Id': '36', 'Name': 'zhangsan', 'Age': '27', 'Phone': '01082667896'} };
var message = JSON2.stringify(jsonData)
$.ajax({
　　　　type: "POST",
　　　　url: "AjaxService/Post",
　　　　contentType: "application/json; charset=utf-8",
　　　　data: message,
　　　　dataType: "json",
　　　　success: function (json) { alert(json) },
　　　　error: function (error) {
　　　　alert("調(diào)用出錯(cuò)" + error.responseText);
　　}
});

運(yùn)行結(jié)果如下圖：

　　如同在WebService中一樣：客戶端上傳的JSON字符串格式的數(shù)據(jù)，會(huì)在服務(wù)端復(fù)雜數(shù)據(jù)類型中的相應(yīng)字段中。
這樣就通過JQ+JSON完成了與REST WCF的交互。但是有一點(diǎn)需要注意的是：在使用POST操作時(shí)，在客戶端與服務(wù)端交互過程中，需要指定WebMessageBodyStyle、在GET操作時(shí)，不論格式，可以不必指定。用途是：指定是否包裝參數(shù)和返回值。也就是在客戶端與服務(wù)端的交互過程中，上傳給服務(wù)端的參數(shù)以及服務(wù)端回傳給客戶端的返回值需要做怎樣的包裝操作。這一點(diǎn)非常重要，否則調(diào)用在消費(fèi)服務(wù)是會(huì)有異常。
WebMessageBodyStyle的定義如下：

public enum WebMessageBodyStyle
{
　　Bare,
　　Wrapped,
　　WrappedRequest,
　　WrappedResponse
}

　　MSDN給出的說明如下：

• Bare 不包裝請(qǐng)求和響應(yīng)。
• Wrapped 包裝請(qǐng)求和響應(yīng)。
• WrappedRequest 包裝請(qǐng)求，但不包裝響應(yīng)。
• WrappedResponse 包裝響應(yīng)，但不包裝請(qǐng)求。

　　與WebService調(diào)用異同總結(jié)：

• 　　1、調(diào)用方式一樣。
• 　　2、客戶端發(fā)送給服務(wù)端數(shù)據(jù)格式略有差別。在WebService中可以通過形如：data: "{'name':'zhangsan'}",向服務(wù)端發(fā)送請(qǐng)求，但是這種字符串格式中RESTful中是不被支持的。
• 　　3、WebService調(diào)用結(jié)果通過.d獲取，即json.d。而在RESTful Service中，直接獲取,即json。
• 　　4、WebService不用指定客戶端請(qǐng)求、服務(wù)端相應(yīng)的格式。而在RESTful Service中需要指定

這個(gè)過程也不復(fù)雜，有此類開發(fā)經(jīng)驗(yàn)的人很容易。但是對(duì)初次接觸REST開發(fā)的人來說還是需要費(fèi)一番周折的。

參考：

http://www.west-wind.com/weblog/posts/2008/Apr/21/jQuery-AJAX-calls-to-a-WCF-REST-Service

Jquery1.4 API手冊(cè)

MSDN