jQuery调用RESTful WCF示例代码(GET方法/POST方法)

　　不废话了，直奔主题吧

　　wcf端：

　　近几年比较流行restful，为了能让ajax调用，同时也为了支持restful风格的uri，在创建一个Ajax-enabled Wcf Service后，必须手动修改svc文件，指定Factory，即：

　　<%@ ServiceHost Language="C#" Debug="true" Service="ajaxSample.HelloWorld" CodeBehind="HelloWorld.svc.cs" Factory="System.ServiceModel.Activation.WebServiceHostFactory" %>

　　注：如果不添加Factory，则wcf将无法用类似http://localhost/helloWorld.svc/Hello/person/name 的restful方式直接访问。

　　同时还要去掉web.config中的<enableWebScript />即类似:

　　<system.serviceModel>

　　 </behavior>

　　</endpointBehaviors>

　　</behaviors>

　　<serviceHostingEnvironment aspNetCompatibilityEnabled="true"

　　multipleSiteBindingsEnabled="true" />

　　<endpoint address="" behaviorConfiguration="ajaxSample.HelloWorldAspNetAjaxBehavior"

　　binding="webHttpBinding" contract="ajaxSample.HelloWorld" />

　　</service>

　　</services>

　　</system.serviceModel>

　　好了，开始写代码，鉴于wcf调用时有GET/POST二种方式，下面把几种常用的情况都写一个示例方法：

复制代码代码如下:

　　using System.Collections.Generic;

　　using System.ServiceModel;

　　using System.ServiceModel.Activation;

　　using System.ServiceModel.Web;

　　namespace ajaxSample

　　{

　　[ServiceContract(Namespace = "http://yjmyzz.cnblogs.com/")]

　　[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]

　　public class HelloWorld

　　{

　　/// <summary>

　　/// 只能Post的Restful方法

　　/// </summary>

　　/// <param name="person"></param>

　　/// <param name="welcome"></param>

　　/// <returns></returns>

　　[OperationContract]

　　[WebInvoke(Method = "POST", UriTemplate = "PostRestfulTest/{person}/{welcome}", ResponseFormat = WebMessageFormat.Json)]

　　public List<string> PostRestfulTest(string person,string welcome)

　　{

　　List<string> result = new List<string>();

　　result.Add("PostRestfulTest -> from server:");

　　result.Add(person);

　　result.Add(welcome);

　　return result;

　　}

　　/// <summary>

　　/// 只能Get的Restful方法

　　/// </summary>

　　/// <param name="person"></param>

　　/// <param name="welcome"></param>

　　/// <returns></returns>

　　[OperationContract]

　　[WebInvoke(Method = "GET", UriTemplate = "GETRestfulTest/{person}/{welcome}", ResponseFormat = WebMessageFormat.Json)]

　　public List<string> GETRestfulTest(string person, string welcome)

　　{

　　List<string> result = new List<string>();

　　result.Add("GETRestfulTest -> from server:");

　　result.Add(person);

　　result.Add(welcome);

　　return result;

　　}

　　/// <summary>

　　/// 即可Get与Post的Restful方法

　　/// </summary>

　　/// <param name="person"></param>

　　/// <param name="welcome"></param>

　　/// <returns></returns>

　　[OperationContract]

　　[WebInvoke(Method = "*", UriTemplate = "RestfulTest/{person}/{welcome}", ResponseFormat = WebMessageFormat.Json)]

　　public List<string> RestfulTest(string person, string welcome)

　　{

　　List<string> result = new List<string>();

　　result.Add("RestfulTest -> from server:");

　　result.Add(person);

　　result.Add(welcome);

　　return result;

　　}

　　/// <summary>

　　/// 只能Post的常规方法(注：Post方式，BodyStyle必须设置成WrappedRequest或Wrapped)

　　/// </summary>

　　/// <param name="person"></param>

　　/// <param name="welcome"></param>

　　/// <returns></returns>

　　[OperationContract]

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

　　public List<string> PostTest(string person, string welcome)

　　{

　　List<string> result = new List<string>();

　　result.Add("PostRestfulTest -> from server:");

　　result.Add(person);

　　result.Add(welcome);

　　return result;

　　}

　　/// <summary>

　　/// 只能Get的常规方法

　　/// </summary>

　　/// <param name="person"></param>

　　/// <param name="welcome"></param>

　　/// <returns></returns>

　　[OperationContract]

　　[WebInvoke(Method = "GET", ResponseFormat = WebMessageFormat.Json)]

　　public List<string> GETTest(string person, string welcome)

　　{

　　List<string> result = new List<string>();

　　result.Add("GETTest -> from server:");

　　result.Add(person);

　　result.Add(welcome);

　　return result;

　　}

　　jQuery调用代码：

复制代码代码如下:

　　$().ready(function () {

　　$.post("HelloWorld.svc/PostRestfulTest/111/222", function (data) {

　　alert("PostRestfulTest调用成功，返回值为：" + data);

　　})

　　$.get("HelloWorld.svc/GETRestfulTest/333/444", function (data) {

　　alert("GETRestfulTest调用成功，返回值为：" + data);

　　})

　　$.get("HelloWorld.svc/RestfulTest/555/666", function (data) {

　　alert("RestfulTest GET方式调用成功，返回值为：" + data);

　　})

　　$.post("HelloWorld.svc/RestfulTest/777/888", function (data) {

　　alert("RestfulTest POST方式调用成功，返回值为：" + data);

　　})

　　$.get("HelloWorld.svc/GETTest", { person: "aaa", welcome: "bbb" }, function (data) {

　　alert("GETTest 调用成功，返回值为：" + data);

　　});

　　$.ajax({

　　url: "HelloWorld.svc/PostTest",

　　type: "POST",

　　contentType: "application/json",

　　data: '{"person":"ccc","welcome":"ddd"}',

　　dataType: "html",

　　success: function (data) { alert("PostTest调用成功，返回值为：" + data); }

　　});

　　})

　　</script>

　　有时候，WCF暴露的方法中可能需要一些敏感信息做为参数(比如用户名/用户ID之类)，这时如果直接用js来调用wcf，可能会把这部分信息泄漏在客户端，这种场景下，我们也经常用一个服务端的ashx来做中转

　　TestService.svc

复制代码代码如下:

　　using System.ServiceModel;

　　namespace ashx_jQuery

　　{

　　[ServiceContract]

　　public class TestService

　　{

　　/// <summary>

　　/// 获取当前用户指定月份的工资

　　/// </summary>

　　/// <param name="userId"></param>

　　/// <param name="month"></param>

　　/// <returns></returns>

　　[OperationContract]

　　public double GetSalary(int userId,int month)

　　{

　　if (month == 1)//只是演示而已

　　{

　　return 5000;

　　}

　　else

　　{

　　return 1000;

　　}

　　AjaxProcess.ashx

复制代码代码如下:

　　using System.Web;

　　namespace ashx_jQuery

　　{

　　/// <summary>

　　/// Summary description for AjaxProcess

　　/// </summary>

　　public class AjaxProcess : IHttpHandler

　　{

　　public void ProcessRequest(HttpContext context)

　　{

　　context.Response.ContentType = "text/plain";

　　string month = context.Request["month"];

　　TestService wcf = new TestService();

　　double salary = wcf.GetSalary(GetUserId(), int.Parse(month));

　　context.Response.Write("{salary:" + salary + "}");

　　}

　　/// <summary>

　　/// 获取当前的用户ID

　　/// </summary>

　　/// <returns></returns>

　　private int GetUserId()

　　{

　　return 1;

　　}

　　public bool IsReusable

　　{

　　get

　　{

　　return false;

　　}

　　jQuery调用:

复制代码代码如下:

　　<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="ashx_jQuery._default" %>

　　<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

　　<title>jQuery ashx Sample</title>

　　$().ready(function () {

　　$("#btnTest").click(function () {

　　$.post(

　　"AjaxProcess.ashx",

　　{ month:1 },

　　function (e) {

　　var d = eval("(" + e + ")");

　　alert(d.salary);

　　}, "html");

　　})

　　</script>

　　</head>

　　<body>

　　</form>

　　</body>

　　</html>

　　示例代码：点击下载

教程首页更多教程