jQuery 调用WebService 实例讲解
1.首先建一个WebService程序
///<summary> ///WebService1的摘要说明 ///</summary> [WebService(Namespace="http://tempuri.org/")] [WebServiceBinding(ConformsTo=WsiProfiles.BasicProfile1_1)] [ToolboxItem(false)] //若要允许使用ASP.NETAJAX从脚本中调用此Web服务,请取消对下行的注释。 [System.Web.Script.Services.ScriptService] publicclassWebService1:System.Web.Services.WebService { [WebMethod] publicstringHelloWorld() { CommonData.Json.ObjectSerializationser=newCommonData.Json.ObjectSerialization(); Studentstu=newStudent(); stu.Id=1; stu.Name="hechen"; stringjson=ser.EntityToJson(stu); returnjson; } }
[System.Web.Script.Services.ScriptService]这里得注意,默认情况下这个特性是注释起来的,如果想用Javascript来调用WebService就要取消这个注释
WebService的内容不必多说,用Jquery调用WebService返回肯定是一个xml。而xml是说明文件,而不是具体方法返回的值,所以我们做适当的处理。我们这里WebService方法返回的是JSON数据,以便在前台解析。下载是实体类序列化JSON的代码。
2.实体对象序列化JSON
/** * *2009-5-26 *贺臣 * *将某个对象转化为Json数据格式 **/ usingSystem; usingSystem.Collections.Generic; usingSystem.Linq; usingSystem.Text; usingSystem.IO; usingSystem.Data; usingSystem.ServiceModel.Web; usingSystem.Runtime.Serialization; usingSystem.Runtime.Serialization.Json; namespaceCommonData.Json { publicclassObjectSerialization { privateobject_entity; ///<summary> ///被序列化得实体对象 ///</summary> publicobjectEntity { get{return_entity;} set{_entity=value;} } privatestring_jsonData; ///<summary> ///被转化为json格式数据的对象 ///</summary> publicstringJsonData { get{return_jsonData;} set{_jsonData=value;} } ///<summary> ///无参数构造方法 ///</summary> publicObjectSerialization() { } ///<summary> ///有参数构造方法 ///</summary> ///<paramname="entity">要被序列化得实体对象</param> publicObjectSerialization(objectentity) { this._entity=entity; } ///<summary> ///序列化实体对象 ///</summary> ///<returns></returns> publicstringEntityToJson() { varserializer=newDataContractJsonSerializer(Entity.GetType()); MemoryStreamms=newMemoryStream(); serializer.WriteObject(ms,Entity); byte[]myByte=newbyte[ms.Length]; ms.Position=0; ms.Read(myByte,0,(int)ms.Length); stringdataString=Encoding.UTF8.GetString(myByte); returndataString; } ///<summary> ///序列化实体对象 ///</summary> ///<paramname="entity">要被序列化得实体对象</param> ///<returns></returns> publicstringEntityToJson(objectentity) { this._entity=entity; returnEntityToJson(); } ///<summary> ///将Json格式数据转换为对象 ///</summary> ///<returns></returns> publicTGetObjectJson<T>() { MemoryStreamms=newMemoryStream(Encoding.UTF8.GetBytes(JsonData)); varserializer=newDataContractJsonSerializer(typeof(T)); Tt=(T)serializer.ReadObject(ms); returnt; } ///<summary> ///将Json格式数据转换为对象 ///</summary> ///<paramname="jsonData">json数据格式</param> ///<returns></returns> publicTGetObjectJson<T>(stringjsonData) { this._jsonData=jsonData; returnGetObjectJson<T>(); } } }
注意序列化实体必须用可序列化特性修饰,如Serialiable,否则它不能序列化为JSON数据字符串
3.前台程序Jquery调用
<scriptsrc="jquery-1[1].2.3.min.js"type="text/javascript"></script> <scriptsrc="json2.js"type="text/javascript"></script> <scripttype="text/javascript"> $(document).ready(function(){ $("#btnClick").click(function(){ $.ajax({ url:"http://localhost:10168/WebService1.asmx/HelloWorld", beforeSend:function(x){ x.setRequestHeader("Content-Type","application/json;charset=utf-8"); }, data:{}, dataType:"json", type:"POST", error:function(x,e){ alert(x.responseText); }, complete:function(x){ //alert(x.responseText); }, success:function(data){ varmsg=data.d; varjson=JSON2.parse(msg); alert(json.id); } }); }); }); </script>
这里进入了Jquery的核心文件和一个JSON2.js文件
url:"http://localhost:10168/WebService1.asmx/HelloWorld" 这个是调用WebService方法的路径,HelloWorld是WebService中的方法。
同时还要设置WebService请求后返回的参数格式(json),data是用于解释返回的值。这里值得注意的是data是一个json格式的字符串,而且对象名为d,所以我们用到了后面的varmsg=data.d;
如果我们要能够像JSON那个以 .操作来访问键值,我们就使用到了JSON2.js中的方法将json字符串转化为json对象,这样就可以以.操作来访问对象了。
如果我们需要调用带参数的WebService,则我们可以再data中指定传递的参数,参数名要和WebService中方法参数名相同。
在这里应该说是没有问题,我在写这个例子的时候,并不是这么顺利,后来查了很多关于WebService的资料,原来我们要修改WebService中Web.config的配置,否则我们不能以Url那种格式访问WebService。
配置如下:
在System.web这个节点中添加如下配置即可
<webServices> <protocols> <addname="HttpGet"/> <addname="HttpPost"/> </protocols> </webServices>
以上就是本文的全部内容,希望能给大家一个参考,也希望大家多多支持毛票票。