当前位置:  编程技术>WEB前端

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

    来源: 互联网  发布时间:2014-08-25

    本文导语:  不废话了,直奔主题吧 wcf端: 近几年比较流行restful,为了能让ajax调用,同时也为了支持restful风格的uri,在创建一个Ajax-enabled Wcf Service后,必须手动修改svc文件,指定Factory,即: 注:如果不添加Factory,则wcf将无法用类似http...

不废话了,直奔主题吧

wcf端:

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

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

同时还要去掉web.config中的即类似:


   
     
       
         
       
     
   
   
   
     
       
     
   
 

好了,开始写代码,鉴于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
    {

        ///
        /// 只能Post的Restful方法
        ///
        ///
        ///
        ///
        [OperationContract]
        [WebInvoke(Method = "POST", UriTemplate = "PostRestfulTest/{person}/{welcome}", ResponseFormat = WebMessageFormat.Json)]
        public List PostRestfulTest(string person,string welcome)
        {
            List result = new List();

            result.Add("PostRestfulTest -> from server:");
            result.Add(person);
            result.Add(welcome);
            return result;
        }

        ///
        /// 只能Get的Restful方法
        ///
        ///
        ///
        ///
        [OperationContract]
        [WebInvoke(Method = "GET", UriTemplate = "GETRestfulTest/{person}/{welcome}", ResponseFormat = WebMessageFormat.Json)]
        public List GETRestfulTest(string person, string welcome)
        {
            List result = new List();

            result.Add("GETRestfulTest -> from server:");
            result.Add(person);
            result.Add(welcome);
            return result;
        }

        ///
        /// 即可Get与Post的Restful方法
        ///
        ///
        ///
        ///
        [OperationContract]
        [WebInvoke(Method = "*", UriTemplate = "RestfulTest/{person}/{welcome}", ResponseFormat = WebMessageFormat.Json)]
        public List RestfulTest(string person, string welcome)
        {
            List result = new List();

            result.Add("RestfulTest -> from server:");
            result.Add(person);
            result.Add(welcome);
            return result;
        }

 
        ///
        /// 只能Post的常规方法(注:Post方式,BodyStyle必须设置成WrappedRequest或Wrapped)
        ///
        ///
        ///
        ///
        [OperationContract]
        [WebInvoke(Method = "POST", ResponseFormat = WebMessageFormat.Json, BodyPostRestfulTest -> from server:");
            result.Add(person);
            result.Add(welcome);
            return result;
        }

        ///
        /// 只能Get的常规方法
        ///
        ///
        ///
        ///
        [OperationContract]
        [WebInvoke(Method = "GET", ResponseFormat = WebMessageFormat.Json)]
        public List GETTest(string person, string welcome)
        {
            List result = new List();

            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); }
        });
    })


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

TestService.svc

代码如下:

using System.ServiceModel;

namespace ashx_jQuery
{
     [ServiceContract]
    public class TestService 
    {
         ///
         /// 获取当前用户指定月份的工资
         ///
         ///
         ///
         ///
         [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 description for AjaxProcess
    ///
    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 + "}");
        }

 
        ///
        /// 获取当前的用户ID
        ///
        ///
        private int GetUserId() 
        {
            return 1;
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

jQuery调用:
代码如下:






    jQuery ashx Sample
   
   
        $().ready(function () {
            $("#btnTest").click(function () {
                $.post(
                    "AjaxProcess.ashx",
                    { month:1 },
                    function (e) {
                        var d = eval("(" + e + ")");
                        alert(d.salary);
                    }, "html");
            })
        })
   


   
       
   



示例代码:点击下载 

    
 
 

您可能感兴趣的文章:

  • jQuery学习笔记之jQuery原型属性和方法
  • jquery中slideUp()方法与slideDown()方法
  • jQuery 滑动方法slideDown向下滑动元素
  • jquery中fadeIn()方法与fadeOut()方法(示例)
  • jQuery.extend()、jQuery.fn.extend()扩展方法示例详解
  • jquery show()方法与hide()方法的小例子
  • jquery show()方法与hide()方法(示例)
  • jquery上传插件fineuploader上传文件使用方法(jquery图片上传插件)
  • jQuery animate方法定位页面具体位置(示例)
  • Jquery图片延迟加载插件jquery.lazyload.js的使用方法
  • 判断一个对象是否为jquery对象的方法
  • jQuery 追加元素的方法如append、prepend、before
  • jQuery获得内容与属性方法
  • jQuery.holdReady()使用方法
  • jquery动态添加元素事件失效问题解决方法
  • jQuery获得内容和属性方法及示例
  • 使用jQuery重置(reset)表单的方法
  • 点击表单提交时出现jQuery没有权限的解决方法
  • jquery获取第几个元素方法示例 jquery选择器
  • Jquery之Bind方法参数传递与接收的三种方法
  • jQuery定时器插件 jQuery Timers应用示例
  • jquery打开dialog的简单示例
  • jQuery设置input type值示例
  • jquery弹窗代码示例
  • jquery的父子兄弟节点查找示例代码
  • jquery遍历checkbox简单示例
  • jquery动态添加option示例
  • Jquery定时器的简单示例
  • JQuery获取上传文件大小(示例)
  • Jquery在指定DIV加载HTML示例代码
  • jQuery获得内容和属性示例代码
  •  
    本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
    本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • jquery live()调用不存在的解决方法
  • jquery、js调用iframe父窗口与子窗口元素的方法整理
  • 浅析jQuery中调用ajax方法时在不同浏览器中遇到的问题
  • jquery getJSON跨域调用数据的例子
  • 浅析jquery ajax异步调用方法中不能给全局变量赋值的原因及解决方法
  • jQuery加载或调用CSS文件的例子
  • Jquery ajax调用action返回值的问题
  • 在jquery中的ajax方法怎样通过JSONP进行远程调用
  • jquery中的ajax方法怎样通过JSONP进行远程调用
  • jquery动态调用css文件方法示例
  • Jquery调用Webservice传递Json数组
  • Jquery Ajax解析XML数据(同步及异步调用)简单实例
  • JQuery与Ajax调用新浪API获取短网址的代码
  • JQuery调用WebServices的方法和4个实例
  • jQuery dialog 异步调用数据(webserivce或ashx)的实现代码
  • jquery $.ajax()调用asp.net后台的方法
  • jquery ajax jsonp跨域调用实例代码
  • jQuery ajax调用WCF服务实例
  • jquery.Ajax()方法调用Asp.Net后台的方法解析
  • 通过javascript库JQuery实现页面跳转功能代码
  • jQuery鼠标动画插件 jquery-ahover
  • jQuery概述,代码举例及最新版下载
  • jQuery向导插件 Jquery Wizard Plugin
  • Jquery操作html复选框checkbox:全选,全不选和反选
  • jQuery圆角插件 jQuery Corners
  • struts+spring+hibernate+jquery实现分页功能的几个基本类介绍(异步加载)
  • jQuery相册插件 jQuery.popeye
  • jQuery UI组件 jQuery UI
  • jQuery右键菜单插件 jQuery ContextMenu
  • jQuery分页插件 Pagination jQuery Plugin
  • jQuery日历插件 jQuery Week Calendar


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3