当前位置: 代码迷 >> Web前端 >> 应用javascript调用webservice示例
  详细解决方案

应用javascript调用webservice示例

热度:398   发布时间:2012-11-23 00:03:43.0
使用javascript调用webservice示例

再javascript中使用soap调用webservice的示例代码

代码再IE6和FF测试通过,对于c#写的webservice和java(xfire)写的,都测试过,没有问题

此代码原型来源于 http://www.guru4.net/ 的javascript soapclient

发现这个下载的js只能用于调用c#的webservice,所以利用mootools,重新封装,达到IE和火狐的兼容的同时,兼容java和c#

(再例子中使用的 mootools.v1.11.js 文件,做过修改)

客户端js调用代码如下

js 代码
?
  1. function?ajaxRequest() ??
  2. ????{ ??
  3. ????????var?url?=?"http://localhost:88/webservicedemo.asmx"; ??
  4. ???????? ??
  5. ????????//设置webService传入参数 ??
  6. ????????// ??
  7. ????????//注意: ??
  8. ????????// ??
  9. ????????//????调用.Net?写的webservice(如例子中的webservicedemo.asmx) ??
  10. ????????//???????????HelloTo(String?name)???针对name参数必须写成?<name></name>wqj,还有更多参数一样写,使用名称匹配 ??
  11. ????????//???????????传入的参数数量可以不等于(多于或少于)方法要求的参数 ??
  12. ????????// ??
  13. ????????//????调用java(xfire)?发布的webService ??
  14. ????????//???????????传入的参数必须与调用方法的参数数量相等,且按传入值的顺序进行匹配 ??
  15. ????????// ??
  16. ???????? ??
  17. ????????var?para?=?"<name></name>wqj";?这里应该是一个标准的xml形式,源码贴出来时被虑掉了,请参看附件源码??
  18. ???????? ??
  19. ????????var?op?=?{ ??
  20. ????????????????????data:para, ??
  21. ????????????????????onComplete:?showResponse, ??
  22. ????????????????????onFailure:showError, ??
  23. ????????????????????update:'ajaxBack' ??
  24. ?????????????????}; ??
  25. ??
  26. ????????var?service?=?new?WebService(url,"HelloTo",op); ??
  27. ????????service.request(); ??
  28. ????????return?false; ??
  29. ????} ??
  30. ????function?showError(obj) ??
  31. ????{ ??
  32. ????????//obj?是一个xmlHttpRequest对象 ??
  33. ????????alert("error"); ??
  34. ????} ??
  35. ????function?showResponse(requestText,requestXML) ??
  36. ????{ ??
  37. ????????//requestText?返回的文本 ??
  38. ????????//requestXML?返回的XML ??
  39. ????????alert("ok"); ??
  40. ????}??

WebService类的代码如下(webservice.js)

js 代码
?
  1. ??
  2. var?WSDLS?=?{}; ??
  3. ??
  4. var?WebService?=?new?Class({ ??
  5. ??
  6. ????url?:?'', ??
  7. ????method?:?'', ??
  8. ????options:? ??
  9. ????{ ??
  10. ????????method:'GET', ??
  11. ????????data:?null, ??
  12. ????????update:?null, ??
  13. ????????onComplete:?Class.empty, ??
  14. ????????onError:Class.empty, ??
  15. ????????evalScripts:?false, ??
  16. ????????evalResponse:?false??
  17. ????}, ??
  18. ???? ??
  19. ????initialize:?function(url,method,options) ??
  20. ????{ ??
  21. ????????this.url?=?url; ??
  22. ????????this.method?=?method; ??
  23. ????????this.options?=?options; ??
  24. ??
  25. ????}, ??
  26. ???? ??
  27. ????request?:?function() ??
  28. ????{ ??
  29. ????????var?wsdl?=?WSDLS[this.url]; ??
  30. ????????if(!wsdl)? ??
  31. ????????{ ??
  32. ????????????var?op?=?{method:'GET',async:?false}; ??
  33. ????????????var?wsdlAjax?=?new?XHR(op).send(this.url?+?"?wsdl",?null);?????????? ??
  34. ????????????wsdl?=?wsdlAjax.transport.responseXML; ??
  35. ????????????WSDLS[this.url]?=?wsdl; ??
  36. ????????} ??
  37. ????????this.setSoap(wsdl); ??
  38. ????}, ??
  39. ???????? ??
  40. ????setSoap?:?function(wsdl) ??
  41. ????{ ??
  42. ???????? ??
  43. ????????var?ns?=?(wsdl.documentElement.attributes["targetNamespace"]?+?""?==?"undefined")???wsdl.documentElement.attributes.getNamedItem("targetNamespace").nodeValue?:?wsdl.documentElement.attributes["targetNamespace"].value; ??
  44. ????????var?sr?=? ??
  45. ????????????????"<!---->"?+ ??
  46. ????????????????""
  47. ????????????????"xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\"?"?+ ??
  48. ????????????????"xmlns:xsd=\"http://www.w3.org/2001/XMLSchema\"?"?+ ??
  49. ????????????????"xmlns:soap=\"http://schemas.xmlsoap.org/soap/envelope/\">"?+ ??
  50. ????????????????"<soap:body>"</soap:body>?+ ??
  51. ????????????????"<"?+?this.method?+?"?xmlns=\""?+?ns?+?"\">"?+ ??
  52. ?????????????????????(this.options.data?===?null??"":this.options.data)?+ ??
  53. ????????????????"?+?this.method?+?">; ??
  54. ???????? ??
  55. ????????this.options.method?=?'post'; ??
  56. ????????this.options.data?=?null; ??
  57. ???????? ??
  58. ????????var?soapaction?=?((ns.lastIndexOf("/")?!=?ns.length?-?1)???ns?+?"/"?:?ns)?+?this.method; ??
  59. ???????? ??
  60. ????????var?soapAjax?=?new?Ajax(this.url,this.options); ??
  61. ????????soapAjax.setHeader("SOAPAction",?soapaction); ??
  62. ????????soapAjax.setHeader("Content-type",?"text/xml;?charset=utf-8"); ??
  63. ????????soapAjax.request(sr); ??
  64. ????} ??
  65. ???? ??
  66. });??

?在第一个版本中存在以下问题

1. 不能根据webservice的要求输入参数自动组织参数

2. 没有处理返回值

3.一旦webservice调用过程出错,会形成一个死循环(一直弹出error)

?

V2 说明

1. 解决第一版中死循环的问题

2. 统一输入参数的传入形式(与mootools的ajax使用方式完全一致),形式如name=wqj&age=20&........

3. 自动根据参数名对应的值,组织webservice的传入参数,只根据webservice要求的参数名查找对应的值

??? 与顺序不再有关系.(对于xfire中的输入参数使用名称 in0,in1........)

??? 传入的参数数量也不再要求一致,多的自动丢弃,少的自动传空

4. 对于返回的XML,增加提取方法,返回需要的关键返回值(去掉XML的框框)

详细参照附件源码,下面是部分关键代码

?

WebService类的代码如下(webservice.js)

?

js 代码
  1. var?WSDLS?=?{};??
  2. ??
  3. var?WebService?=?new?Class({??
  4. ??
  5. ????url?:?'',??
  6. ????method?:?'',??
  7. ????options:???
  8. ????{??
  9. ????????method:'GET',??
  10. ????????data:?null,??
  11. ????????update:?null,??
  12. ????????onComplete:?Class.empty,??
  13. ????????onError:Class.empty,??
  14. ????????evalScripts:?false,??
  15. ????????evalResponse:?false??
  16. ????},??
  17. ??????
  18. ????initialize:?function(url,method,options)??
  19. ????{?????????
  20. ????????this.url?=?url;??
  21. ????????this.method?=?method;??
  22. ????????this.options?=?options;??
  23. ????},??
  24. ??????
  25. ????request?:?function()??
  26. ????{??
  27. ????????var?wsdl?=?WSDLS[this.url];??
  28. ????????if(!wsdl)???
  29. ????????{??
  30. ????????????var?op?=?{method:'GET',async:?false};??
  31. ????????????var?wsdlAjax?=?new?XHR(op).send(this.url?+?"?wsdl",?null);????????????
  32. ????????????wsdl?=?wsdlAjax.transport.responseXML;??
  33. ????????????WSDLS[this.url]?=?wsdl;??
  34. ????????}??
  35. ??
  36. ????????this.setSoap(wsdl);??
  37. ????},??
  38. ??????????
  39. ????setSoap?:?function(wsdl)??
  40. ????{??
  41. ????????var?paraXML?=?this.getParaXML(wsdl);??
  42. ????????alert(paraXML);??
  43. ????????var?ns?=?(wsdl.documentElement.attributes["targetNamespace"]?+?""?==?"undefined")???wsdl.documentElement.attributes.getNamedItem("targetNamespace").nodeValue?:?wsdl.documentElement.attributes["targetNamespace"].value;??
  44. ????????var?sr?=???
  45. ????????????????""?+??
  46. ????????????????"?+??
  47. ????????????????"xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\"?"?+??
  48. ????????????????"xmlns:xsd=\"http://www.w3.org/2001/XMLSchema\"?"?+??
  49. ????????????????"xmlns:soap=\"http://schemas.xmlsoap.org/soap/envelope/\">"?+??
  50. ????????????????"<soap:body>"</soap:body>?+??
  51. ????????????????"<"?+?this.method?+?"?xmlns=\""?+?ns?+?"\">"?+??
  52. ????????????????????paraXML??+??
  53. ????????????????"<!---->?+?this.method?+?">";??
  54. ??????????
  55. ????????this.options.method?=?'post';??
  56. ????????this.options.data?=?null;??
  57. ??????????
  58. ????????var?soapaction?=?((ns.lastIndexOf("/")?!=?ns.length?-?1)???ns?+?"/"?:?ns)?+?this.method;??
  59. ??
  60. ????????var?soapAjax?=?new?Ajax(this.url,this.options);??
  61. ????????soapAjax.setHeader("SOAPAction",?soapaction);??
  62. ????????soapAjax.setHeader("Content-type",?"text/xml;?charset=utf-8");??
  63. ????????soapAjax.request(sr);???
  64. ????},??
  65. ????getParaXML?:?function(wsdl)??
  66. ????{??
  67. ??????????
  68. ????????var?objNode?=?null;??
  69. ????????var?rtnValue?=?"";??
  70. ????????//java(xfire)??
  71. ????????var?ell?=?this.getElementsByTagName(wsdl,"xsd:element");??????
  72. ????????if(ell.length?==?0)???
  73. ????????{??
  74. ????????????//c#??
  75. ????????????ell?=?this.getElementsByTagName(wsdl,"s:element");????
  76. ????????}??
  77. ????????for(var?i?=?0;?i?<?ell.length;?i++)??
  78. ????????{??
  79. ????????????if(this.getElementAttrValue(ell[i],"name")?==?this.method)??
  80. ????????????{??
  81. ????????????????objNode?=?ell[i];??
  82. ????????????????break;??
  83. ????????????}??
  84. ????????}??
  85. ??
  86. ????????if(objNode?==?null)?return?rtnValue;??
  87. ????????//java(xfire)??
  88. ????????ell?=?this.getElementsByTagName(objNode,"xsd:element");???
  89. ????????if(ell.length?==?0)???
  90. ????????{??
  91. ????????????//c#??
  92. ????????????ell?=?this.getElementsByTagName(objNode,"s:element");??
  93. ????????}??
  94. ????????if(ell.length?==?0)?return?rtnValue?;??
  95. ??????????
  96. ????????var?hash?=?new?Hash();??
  97. ??????????
  98. ????????if(this.options.data?!=?null?&&?this.options.data.clean?!=?"")??
  99. ????????{??
  100. ????????????hash?=?this.options.data.split("&").toHash("=");??
  101. ????????}??
  102. ??????????
  103. ????????for(var?i?=?0;?i?<?ell.length;?i++)??
  104. ????????{??
  105. ????????????var?paraName?=?this.getElementAttrValue(ell[i],"name");??
  106. ????????????rtnValue?=?rtnValue?+?this.getSingleXML(paraName,hash);??
  107. ????????}??
  108. ??????????
  109. ????????return?rtnValue;??
  110. ????},??
  111. ??????
  112. ????getSingleXML?:?function?(name,hash)??
  113. ????{??
  114. ????????name?=?name.trim();??
  115. ??????????
  116. ????????var?rtnValue?=?"";??
  117. ????????if(hash.hasKey(name))??
  118. ????????{??
  119. ????????????rtnValue?=?hash.get(name);??
  120. ????????}??
  121. ????????rtnValue?=?"<"?+?name?+?">"?+?xmlscc(rtnValue)?+?"<!---->?+?name?+?">"??
  122. ????????return?rtnValue;??
  123. ????},??
  124. ????getBackData:?function(xml)??
  125. ????{??
  126. ????????var?rtnValue?=?"";??
  127. ????????//java(xfire)??
  128. ????????var?soap?=?this.getElementsByTagName(xml,"ns1:out");??????
  129. ????????if(soap.length?==?0)??
  130. ????????{??
  131. ????????????//c#??
  132. ????????????soap?=?this.getElementsByTagName(xml,this.method?+?"Result");??
  133. ????????}??
  134. ????????return?soap[0].childNodes[0].nodeValue;???????
  135. ??????????
  136. ????},??
  137. ????getElementsByTagName?:?function(objNode,tagName)??
  138. ????{??
  139. ????????//tagName?形式如?xsd:element?,写出tag的全称??
  140. ??
  141. ????????var?ell;??
  142. ????????if(this.isIE())??
  143. ????????{??
  144. ????????????ell?=?objNode.getElementsByTagName(tagName);??????
  145. ????????}??
  146. ????????else??
  147. ????????{??
  148. ????????????if(tagName.contains(":"))?tagName?=?tagName.split(":")[1];??
  149. ????????????ell?=?objNode.getElementsByTagName(tagName);???????????
  150. ????????}??
  151. ????????return?ell;??
  152. ????},??
  153. ????getElementAttrValue?:?function(objNode,attrName)??
  154. ????{??
  155. ????????var?rtnValue?=?"";??
  156. ??????????
  157. ????????if(objNode?==?null)?return?rtnValue;??
  158. ??????????
  159. ????????if(objNode.attributes[attrName]?+?""?==?"undefined")??
  160. ????????{???
  161. ????????????if(objNode.attributes.getNamedItem(attrName)?!=?null)??
  162. ????????????????rtnValue?=?objNode.attributes.getNamedItem(attrName).nodeValue?;??
  163. ??????????????
  164. ????????}??
  165. ????????else??
  166. ????????{??
  167. ????????????if(objNode.attributes[attrName]?!=?null)??
  168. ????????????????rtnValue?=?objNode.attributes[attrName].value;??
  169. ????????}??
  170. ????????return?rtnValue;??
  171. ????},??
  172. ????isIE?:?function()??
  173. ????{??
  174. ????????var?isMSIE?=?/*@cc_on!@*/false;??
  175. ????????return?isMSIE;??
  176. ????}??
  177. });??
  178. ??
  179. Array.extend({??
  180. ??????
  181. ????toHash?:?function?(splitChar)??
  182. ????{??
  183. ????????var?hash?=?new?Hash({});??
  184. ????????for(var?i=0;i<this.length;i++)??
  185. ????????{??
  186. ??????????????
  187. ????????????if(this[i].split(splitChar).length?==?1)?contrnue;??
  188. ??
  189. ????????????var?key?=?this[i].split(splitChar)[0].trim();??
  190. ????????????var?value?=?this[i].split(splitChar)[1].trim();??
  191. ??????????????
  192. ????????????hash.set(key,?value);??
  193. ????????}??
  194. ??????????
  195. ????????return?hash;??
  196. ????}??
  197. });??
  198. ??
  199. function?xmlscc(strData)??
  200. {??
  201. ??
  202. ????strData=strData.replace(/&/g,?"&");??
  203. ????strData=strData.replace(/>/g,?">");??
  204. ????strData=strData.replace(/"<");??
  205. ????strData=strData.replace(/"/g,?""");?
  206. ????strData=strData.replace(/'/g,?"'");??
  207. ????return?strData;??
  208. }??

相应的调用代码如下:

?

?

js 代码
?
  1. <script?type=< span="">"text/javascript">??
  2. ??????
  3. ????var?service?;??
  4. ????function?ajaxRequest()??
  5. ????{??
  6. ????????var?url?=?"http://localhost:88/webservicedemo.asmx";??
  7. ??????????
  8. ????????//设置webService传入参数??
  9. ????????//??
  10. ????????//注意:??
  11. ????????//??
  12. ????????//????调用webservice(如例子中的webservicedemo.asmx)??
  13. ????????//???????????HelloTo(String?name)???针对name参数必须写成name=wqj?,还有更多参数一样写,使用&符号分隔(name=11&age=20&.....),使用名称匹配??
  14. ????????//???????????传入的参数数量可以不等于(多于或少于)方法要求的参数??
  15. ??????????
  16. ??????????
  17. ????????var?para?=?"name=wqj";??
  18. ??????????
  19. ????????var?op?=?{??
  20. ????????????????????data:para,??
  21. ????????????????????onComplete:?showResponse,??
  22. ????????????????????onFailure:showError,??
  23. ????????????????????update:'ajaxBack'??
  24. ?????????????????};??
  25. ??
  26. ????????service?=?new?WebService(url,"HelloTo",op);??
  27. ????????service.request();??
  28. ????????return?false;??
  29. ????}??
  30. ????function?showError(obj)??
  31. ????{??
  32. ????????//obj?是一个xmlHttpRequest对象??
  33. ????????alert("error");??
  34. ????}??
  35. ????function?showResponse(requestText,requestXML)??
  36. ????{??
  37. ????????//requestText?返回的文本??
  38. ????????//requestXML?返回的XML??
  39. ????????//?service.getBackData?就是取出返回的XML中,实际需要的数据??
  40. ????????//经过测试兼容?IE,FF??
  41. ????????alert(service.getBackData(requestXML));??
  42. ??????????
  43. ????}??
  44. ????</script>??
  • JavaScriptSOAP.rar (47.1 KB)
  • 描述: js调用webservice示例
  • JavaScriptSOAP(V2).rar (49.5 KB)
  • 描述: js,sope第二版
  •   相关解决方案