javascript,jquery调用xfire驱动的webservice
直接上代码:
soupWrapper.js
/** * 定义满足 SOAP 协议的参数。 * 在这个方法中要定义以下几个参数: * 1.调用服务的方法名; * 2.参数名称以及参数值 */ /** 仅带一个参数指明要调用某服务的 ** 方法(js不支持方法同名不同参,后定义的会将先定义的覆盖掉)~ */ function wrapMethodName(strMethodName) { var postData = "<?xml version=\"1.0\" encoding=\"utf-8\"?>"; postData += "<soap:Envelope "; postData += "xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\" "; postData += "xmlns:xsd=\"http://www.w3.org/2001/XMLSchema\" "; postData += "xmlns:soap=\"http://schemas.xmlsoap.org/soap/envelope/\">"; postData += "<soap:Body><"; postData += strMethodName; postData += " xmlns=\"http://localhost:8888/FirstWebServiceServer\" /></soap:Body>"; postData += "</soap:Envelope>"; alert("wrapData(strMethodName)\n拼裝結果:\n" + postData); return postData; } /** * 第一个参数指明要调用的方法, * 第二个参数传递字符串 json 数据。 * 注意,虽然对于不管何种需求,都只是向服务器传递了一个 json字符串类型的数据 * 但由于 json 这个数据格式能够包含非常丰富的数据, * 所以说,是完全能够弥补调用方法的参数仅限于一个的缺憾的~ */ function wrapData(strMethodName, strJsonParam) { // 根据WSDL分析sayHelloWorld是方法名,parameters是传入参数名 var postData = "<?xml version=\"1.0\" encoding=\"utf-8\"?>"; postData += "<soap:Envelope "; postData += "xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\" "; postData += "xmlns:xsd=\"http://www.w3.org/2001/XMLSchema\" "; postData += "xmlns:soap=\"http://schemas.xmlsoap.org/soap/envelope/\">"; postData += "<soap:Body><"; postData += strMethodName; postData += " xmlns=\"http://localhost:8888/FirstWebServiceServer\"><jsonData>"; postData += strJsonParam; postData += "</jsonData></"; postData += strMethodName; postData += "></soap:Body>"; postData += "</soap:Envelope>"; alert("wrapData(strMethodName, strJsonParam)\n拼裝結果:\n" + postData); return postData; }
testSimplified.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>testSimplified3</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/soupWrapper.js"></script> <script type="text/javascript"> $(function() { $("#btnWs").click(btnAjaxPost); }) function btnAjaxPost() { $.ajax({ type: 'post', contentType: 'application/json; charset=utf-8', url: 'http://localhost:8888/FirstWebServiceServer/services/Weather', data: wrapMethodName("weather"), dataType: 'xml', success: function(xml) { var jsonStr; if($.browser.msie){ jsonStr = xml.getElementsByTagName("ns1:out")[0].childNodes[0].nodeValue; } else{ // 这种写法通用一点,调用 webservice 的什么方法是会经常发生变动的~ jsonStr = $(xml).find("[nodeName=ns1:out]").text(); } if(jsonStr != null) { // 对 JQuery API 不是很熟悉~ $('#result').text(jsonStr); } else { alert("jsonStr == null"); return; } }, error: function(x, e) { alert('error:' + x.responseText); } }); } </script> </head> <body> <input type="button" id="btnWs" value="使用soupWrapper.js调用Weather服务的weather方法" /> <div id='result'></div> <div>有点儿组牛角尖了,查了蛮久xfire如何返回json数据。</div> <div>其实也不用啊,用JQuery从返回的xml找到实际的json数据并不难啊,下面两种方法都可以:</div> <div>resultXml.getElementsByTagName("ns1:out")[0].childNodes[0].nodeValue</div> <div>$(resultXml).find("[nodeName=ns1:out]").text();</div> <div>有时候真的去独立思考一下,所寻找的答案是非真值得自己去花费那么多的精力~</div> </body> </html>