zoukankan      html  css  js  c++  java
  • Jquery Ajax访问WCF(JSON)

    转载自http://bright895.blog.163.com/blog/static/182699233201271682847261/

    WCF 服务:

    一、IService1.CS

    /*
        系统要引用System.ServiceModel.Web 
        ServiceContract属性把此类型公开在WCF服务中
        AspNetCompatibilityRequirements属性确保端点使用了WEBHTTP绑定模型.在接口的实现类上注解声明
        与webconfig中的<serviceHostingEnvironment aspNetCompatibilityEnabled="true" />配合使用
        OperationContract属性把方法公开在WCF服务中
        RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json
        声明传进来和返回去的数据类型为Json
       
        BodyStyle = WebMessageBodyStyle.WrappedRequest
        把参数包装一下,这样可以传递多个参数进来,
          
        BodyStyle=WebMessageBodyStyle.Bare
        未包装格式,输出的就是纯的Json格式。要在    
         * 
         */
        // 注意: 如果更改此处的接口名称 "IService1",也必须更新 Web.config 中对 "IService1" 的引用。
        [ServiceContract]
        public interface IService1
        {
             
            [OperationContract]
            [WebGet(ResponseFormat=WebMessageFormat.Json)]
            string Hello();
            [OperationContract]
            [WebInvoke(RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.WrappedRequest)]
            string Request(int id, string title, string content);
            [OperationContract]
            [WebGet(ResponseFormat=WebMessageFormat.Json,BodyStyle=WebMessageBodyStyle.Bare)]
            Member GetMember(int id);
            [OperationContract]
            [WebGet(ResponseFormat = WebMessageFormat.Json,BodyStyle=WebMessageBodyStyle.WrappedResponse)]
            List<Member> GetMemberList();
            [OperationContract]
            [WebGet(ResponseFormat = WebMessageFormat.Json)]
            Product GetProduct();
            [OperationContract]
            [WebGet(ResponseFormat = WebMessageFormat.Json)]
            DataSet GetProductSet();
            [OperationContract]
            [WebGet(ResponseFormat = WebMessageFormat.Json)]
            List<Product> GetProductList();
        }
        /// <summary>
        /// 此类证明不用 注解[DataContract]也可返回Json
        /// </summary>
        public class Product
        {
            string pro_no = "";
            string pro_name = "";
            decimal pro_price = 0;
            float pro_weight = 0;
            public string Pro_NO
            {
                get { return pro_no; }
                set { pro_no = value; }
            }
            public string Pro_Name
            {
                get { return pro_name; }
                set { pro_name = value; }
            }
            public decimal Pro_Price
            {
                get { return pro_price; }
                set { pro_price = value; }        
            }
            public float Pro_Weight
            {
                get { return pro_weight; }
                set { pro_weight = value; }        
            
            }
        
        }
        // 使用下面示例中说明的数据约定将复合类型添加到服务操作。
        [DataContract]
        public class Member
        {
            int id=0;
            string name = "";
            int age = 0;
            string birth = "";
            [DataMember]
            public int Id
            {
                get{return id;}
                set{id=value;}        
            }
            [DataMember]
            public string Name
            {
                get { return name; }
                set { name = value; }
            }
            [DataMember]
            public int Age
            {
                get { return age; }
                set { age = value; }
            }
            [DataMember]
            public string Birth
            {
                get { return birth; }
                set { birth = value; }        
            }
        }

     

    二、Service1.svc.cs

    // 注意: 如果更改此处的类名“Service1”,也必须更新 Web.config 和关联的 .svc 文件中对“Service1”的引用。
        [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
        public class Service1 : IService1
        {
            public string Hello()
            {
                return "Hello WCF";
            }
            public string Request(int id, string title, string content)
            {
                return string.Format("您输入的标题是:{0}您输入的内容是:{1}此文章的id是:{2}", title, content, id.ToString());
            }
            public Member GetMember(int id)
            {
                List<Member> memberList = new List<Member>();
                Member m1 = new Member { Id = 1, Name = "bright", Age = 24, Birth = "1989-01-01" };
                Member m2 = new Member { Id = 2, Name = "a", Age = 20, Birth = "1993-01-01" };
                Member m3 = new Member { Id = 3, Name = "b", Age = 21, Birth = "1992-01-01" };
                Member m4 = new Member { Id = 4, Name = "c", Age = 22, Birth = "1991-01-01" };
                Member m5 = new Member { Id = 5, Name = "d", Age = 23, Birth = "1990-01-01" };
                memberList.Add(m1);
                memberList.Add(m2);
                memberList.Add(m3);
                memberList.Add(m4);
                memberList.Add(m5);
                return memberList.Where(m => m.Id == id).ToList()[0];
            }
            public List<Member> GetMemberList()
            {
                List<Member> memberList = new List<Member>();
                Member m1 = new Member { Id = 1, Name = "bright", Age = 24, Birth = "1989-01-01" };
                Member m2 = new Member { Id = 2, Name = "a", Age = 20, Birth = "1993-01-01" };
                Member m3 = new Member { Id = 3, Name = "b", Age = 21, Birth = "1992-01-01" };
                Member m4 = new Member { Id = 4, Name = "c", Age = 22, Birth = "1991-01-01" };
                Member m5 = new Member { Id = 5, Name = "d", Age = 23, Birth = "1990-01-01" };
                memberList.Add(m1);
                memberList.Add(m2);
                memberList.Add(m3);
                memberList.Add(m4);
                memberList.Add(m5);
                
                return memberList;
            }
            public Product GetProduct()
            {
                Product pro1 = new Product { Pro_Name = "candy",Pro_NO="6978123456",Pro_Price=88.56M,Pro_Weight=6.8F };
                return pro1;        
            }
            public List<Product> GetProductList()
            {
                List<Product> proList = new List<Product>();
                
                Product pro1 = new Product { Pro_Name = "candy1", Pro_NO = "6978123451", Pro_Price = 88.51M, Pro_Weight = 6.8F };
                Product pro2 = new Product { Pro_Name = "candy2", Pro_NO = "6978123452", Pro_Price = 88.52M, Pro_Weight = 6.8F };
                Product pro3 = new Product { Pro_Name = "candy3", Pro_NO = "6978123453", Pro_Price = 88.53M, Pro_Weight = 6.8F };
                Product pro4 = new Product { Pro_Name = "candy4", Pro_NO = "6978123454", Pro_Price = 88.54M, Pro_Weight = 6.8F };
                Product pro5 = new Product { Pro_Name = "candy5", Pro_NO = "6978123455", Pro_Price = 88.55M, Pro_Weight = 6.8F };
                proList.Add(pro1);
                proList.Add(pro2);
                proList.Add(pro3);
                proList.Add(pro4);
                proList.Add(pro5);
                return proList;
            }
            /// <summary>
            /// 这样返回DataSet是不行的,得到的不是可利用的Json内容。可以将DataSet系列化成Json字符串再返回
            /// </summary>
            /// <returns></returns>
            public DataSet GetProductSet()
            {
                DataSet ds = new DataSet();
                DataTable dt = new DataTable();
                dt.Columns.Add("Pro_Name");
                dt.Columns.Add("Pro_NO");
                dt.Columns.Add("Pro_Price");
                dt.Columns.Add("Pro_Weight");
                for (int i = 0; i < 25; i++)
                {
                    DataRow dr = dt.NewRow();
                    dr[0] = "a";
                    dr[1] = "6912345678"+i;
                    dr[2] = 8.88M+i;
                    dr[3] = 6.8F+i;
                    dt.Rows.Add(dr);
                }
                ds.Tables.Add(dt);
                return ds;      
            }
        }

     

    三、Web.config

     
    
    <system.serviceModel>
    
    <services>
    
    <service name="TestWcfService.Service1" behaviorConfiguration="TestWcfService.Service1Behavior">
    
    <!-- Service Endpoints -->
    
    <endpoint address="" binding="webHttpBinding" contract="TestWcfService.IService1" behaviorConfiguration="TestWcfService.EndBehavior">
    
    <!-- 
    
                  部署时,应删除或替换下列标识元素,以反映
    
                  在其下运行部署服务的标识。删除之后,WCF 将
    
                  自动推导相应标识。
    
              -->
    
    <!--<identity>
    
                <dns value="localhost"/>
    
              </identity>-->
    
    </endpoint>
    
    </service>
    
    </services>
    
    <behaviors>
    
    <serviceBehaviors>
    
    <behavior name="TestWcfService.Service1Behavior">
    
    <!-- 为避免泄漏元数据信息,请在部署前将以下值设置为 false 并删除上面的元数据终结点-->
    
    <serviceMetadata httpGetEnabled="true"/>
    
    <!-- 要接收故障异常详细信息以进行调试,请将以下值设置为 true。在部署前设置为 false 以避免泄漏异常信息-->
    
    <serviceDebug includeExceptionDetailInFaults="false"/>
    
    </behavior>
    
    </serviceBehaviors>
    
    <endpointBehaviors>
    
    <behavior name="TestWcfService.EndBehavior">
    
    <!--<enableWebScript/>--><!--为了输出纯的json而注释掉的-->
    
              <webHttp/>
    
    </behavior>
    
    </endpointBehaviors>
    
    </behaviors>
    
    </system.serviceModel>
    
     

     

    客户端Asp.net WebForm1.aspx (与WCF在同个项目下面)

     

     
    
    <script type="text/javascript" src="jquery-1.2.6.min.js"></script>
    
     
    
         id:<input type="text" id="id" />
    
        title:<input type="text" id="title" />
    
        content:<input type="text" id="content" />
    
        <input type="button" id="btn" onclick="call()"  value="Submit"/>
    
        
    
        <br />
    
       Get Single Member input member id(1~5):<input type="text" id="mid" />    
    
         <input type="button" id="Button1" onclick="getMember()"  value="Submit"/>
    
        
    
         <br />
    
        Get List: <input type="button" id="Button2" onclick="getMemberList()"  value="getMemberList"/>
    
       
    
       <br />    
    
        Single Product:<input type="button" id="Button3" onclick="getProduct()"  value="getProduct"/>
    
        <br />
    
        
    
        Get Product List:<input type="button" id="Button5" onclick="getProductList()"  value="getProductList"/>
    
        <br />
    
     
    
        DataSet:<input type="button" id="Button4" onclick="getProductSet()"  value="getProductSet"/>
    
         
    
         <script type="text/javascript">
    
            $.ajax({
    
                type:"get",
    
                url: "http://localhost:7000/Service1.svc/Hello",
    
                contentType: "application/json; charset=utf-8",            
    
                success: function (json) { alert(json) },
    
                error: function(error) {
    
                    alert("调用出错" + error.responseText);
    
                }
    
     
    
            });
    
     
    
            function call(){
    
                var id = Number($("#id").val());
    
                var title = String($("#title").val());
    
                var content = String($("#content").val());
    
                $.ajax({
    
                    type: "post",
    
                    url: "http://localhost:7000/Service1.svc/Request",                
    
                    data: '{"id":' + id + ',"title":"' + title + '","content":"' + content + '"}',
    
                    contentType: "application/json; charset=utf-8",
    
                    success: function(json) { alert(json) },
    
                    error: function(error) {
    
                        alert("调用出错" + error.responseText);
    
                    }
    
     
    
                });
    
            }
    
     
    
     
    
            function getMember() {
    
                var id = Number($("#mid").val());
    
                $.ajax({
    
                    type: "get",
    
                    url: "http://localhost:7000/Service1.svc/GetMember",
    
                    data: {id:id},
    
                    contentType: "application/json; charset=utf-8",
    
                    success: function(json) { alert(json) },
    
                    error: function(error) {
    
                        alert("调用出错" + error.responseText);
    
                    }
    
     
    
                });
    
            }
    
     
    
            function getMemberList() {            
    
                $.ajax({
    
                    type: "get",
    
                    url: "http://localhost:7000/Service1.svc/GetMemberList",               
    
                    contentType: "application/json; charset=utf-8",
    
                    success: function(json) { alert(json) },
    
                    error: function(error) {
    
                        alert("调用出错" + error.responseText);
    
                    }
    
     
    
                });
    
            }
    
     
    
     
    
            function getProduct() {
    
                
    
                $.ajax({
    
                    type: "get",
    
                    url: "http://localhost:7000/Service1.svc/GetProduct",
    
                    contentType: "application/json; charset=utf-8",
    
                    success: function(json) { alert(json) },
    
                    error: function(error) {
    
                        alert("调用出错" + error.responseText);
    
                    }
    
     
    
                });
    
            }
    
     
    
            function getProductList() {
    
     
    
                $.ajax({
    
                    type: "get",
    
                    url: "http://localhost:7000/Service1.svc/GetProductList",
    
                    contentType: "application/json; charset=utf-8",
    
                    success: function(json) { alert(json) },
    
                    error: function(error) {
    
                        alert("调用出错" + error.responseText);
    
                    }
    
     
    
                });
    
            }
    
     
    
            function getProductSet() {
    
     
    
                $.ajax({
    
                    type: "get",
    
                    url: "http://localhost:7000/Service1.svc/GetProductSet",
    
                    contentType: "application/json; charset=utf-8",
    
                    success: function(json) { alert(json) },
    
                    error: function(error) {
    
                        alert("调用出错" + error.responseText);
    
                    }
    
     
    
                });
    
            }
    
        </script>
  • 相关阅读:
    javascript基础学习三---DOM操作
    小程序-微信开发者工具使用
    回溯算法实践--工作分配问题
    回溯算法理解
    贪心算法--删数问题
    单线程与多线程的区别
    【图解】Web前端实现类似Excel的电子表格
    详细了解JS Map,它和传统对象有什么区别?
    带你彻底弄懂nth-of-type与nth-child的区别
    input 纯数字输入 限制长度 限制 最大值
  • 原文地址:https://www.cnblogs.com/happycat1988/p/3009263.html
Copyright © 2011-2022 走看看