利用JavaScript SOAP Client直接调用webService --完整的前后台配置与调用示例

在前端javascript代码中直接调用webService服务，可以将后台调用webService的业务代码转移到前台，这样做的好处是：

1)减少了后台编码量；

2)在特定的情况下有助于减轻服务器压力，节省服务器资源；

3)有效提高服务器端的资源利用率；

但是也存在一定的弊端：

1)前端javascript编码的稳定性一直以来备受诟病；

2)并且对不同浏览器的编码调试比较麻烦；

对于JavaScriptSOAPClient的优缺点暂且不论，现在主要来了解是如何使用这个js库。

1java后台webService发布

任何前端的数据访问都离不开离不开后台webService的支撑，因此后台webService类库的选择以及配置是很关键的，只有在正确的类库版本和正确的配置webService方可保证后台对外释放的接口能够被有效调用。在java语言中有多重webService类库供大家使用，其中最常用的三种为Axis、Xfire、Restlet。

现在以axis1.4来进行后台webService接口的配置发布。

1)创建一个web工程，在工程的web.xml文件中添加如下配置信息：

<servlet>
		<servlet-name>AxisServlet</servlet-name>
		<servlet-class>org.apache.axis.transport.http.AxisServlet</servlet-class>
	</servlet>
	<servlet>
		<servlet-name>AdminServlet</servlet-name>
		<servlet-class>org.apache.axis.transport.http.AdminServlet</servlet-class>
		<load-on-startup>100</load-on-startup>
	</servlet>
	<servlet>
		<servlet-name>SOAPMonitorService</servlet-name>
		<servlet-class>org.apache.axis.monitor.SOAPMonitorService</servlet-class>
		<init-param>
			<param-name>SOAPMonitorPort</param-name>
			<param-value>5001</param-value>
		</init-param>
		<load-on-startup>100</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>AxisServlet</servlet-name>
		<url-pattern>/servlet/AxisServlet</url-pattern>
	</servlet-mapping>
	<servlet-mapping>
		<servlet-name>AxisServlet</servlet-name>
		<url-pattern>*.jws</url-pattern>
	</servlet-mapping>
	<servlet-mapping>
		<servlet-name>AxisServlet</servlet-name>
		<url-pattern>/services/*</url-pattern>
	</servlet-mapping>
	<servlet-mapping>
		<servlet-name>SOAPMonitorService</servlet-name>
		<url-pattern>/SOAPMonitor</url-pattern>
	</servlet-mapping>
	<mime-mapping>
		<extension>wsdl</extension>
		<mime-type>text/xml</mime-type>
	</mime-mapping>
	<mime-mapping>
		<extension>xsd</extension>
		<mime-type>text/xml</mime-type>
	</mime-mapping>

2)用于发布服务的server-config.wsdd文件配置：

<?xml version="1.0" encoding="UTF-8"?>
<deployment xmlns="http://xml.apache.org/axis/wsdd/" xmlns:java="http://xml.apache.org/axis/wsdd/providers/java">
	<globalConfiguration>
		<parameter name="adminPassword" value="admin" />
		<parameter name="attachments.implementation" value="org.apache.axis.attachments.AttachmentsImpl" />
		<parameter name="sendXsiTypes" value="true" />
		<parameter name="sendMultiRefs" value="true" />
		<parameter name="sendXMLDeclaration" value="true" />
		<parameter name="axis.sendMinimizedElements" value="true" />
		<requestFlow>
			<handler type="java:org.apache.axis.handlers.JWSHandler">
				<parameter name="scope" value="session" />
			</handler>
			<handler type="java:org.apache.axis.handlers.JWSHandler">
				<parameter name="scope" value="request" />
				<parameter name="extension" value=".jwr" />
			</handler>
		</requestFlow>
	</globalConfiguration>
	<handler name="LocalResponder" type="java:org.apache.axis.transport.local.LocalResponder" />
	<handler name="URLMapper" type="java:org.apache.axis.handlers.http.URLMapper" />
	<handler name="Authenticate" type="java:org.apache.axis.handlers.SimpleAuthenticationHandler" />
	<service name="AdminService" provider="java:MSG">
		<parameter name="allowedMethods" value="AdminService" />
		<parameter name="enableRemoteAdmin" value="false" />
		<parameter name="className" value="org.apache.axis.utils.Admin" />
		<namespace>http://xml.apache.org/axis/wsdd/</namespace>
	</service>
	<service name="Version" provider="java:RPC">
		<parameter name="allowedMethods" value="getVersion" />
		<parameter name="className" value="org.apache.axis.Version" />
	</service>
	
	<!-- xedit 生成表格/表单通用服务 -->
	<service name="XeditService" provider="java:RPC">
		<parameter name="allowedMethods" value="*"/>
		<parameter name="scope" value="Request"/>
		<parameter name="className" value="com.adam.xedit.service.server.XeditService"/>
		<parameter name="wsdlPortType" value="Xedit"/>
		<parameter name="typeMappingVersion" value="1.2"/>
	</service>
	
	<transport name="http">
		<requestFlow>
			<handler type="URLMapper" />
			<handler type="java:org.apache.axis.handlers.http.HTTPAuthHandler" />
		</requestFlow>
	</transport>
	<transport name="local">
		<responseFlow>
			<handler type="LocalResponder" />
		</responseFlow>
	</transport>
	
</deployment>

其中xedit生成表格/表单通用服务是我们将要提供的接口类。

3)对外释放的接口类：

package com.adam.xedit.service.server;

import javax.xml.rpc.ServiceException;

import org.apache.axis.AxisFault;
import org.apache.axis.MessageContext;
import org.springframework.context.ApplicationContext;
import org.springframework.remoting.jaxrpc.ServletEndpointSupport;

import com.adam.xedit.service.server.biz.XeditServiceBiz;

/**
 * 对外调用的接口
 * @公司名称：
 * @作者：
 * @创建时间：
 */
public class XeditService extends ServletEndpointSupport
{
    private static final long serialVersionUID = 1L;

    private ApplicationContext applicationContext;
    private XeditServiceBiz xsBiz;

    protected void onInit() throws ServiceException
    {
        super.onInit();
        applicationContext = super.getApplicationContext();
        xsBiz = (XeditServiceBiz) applicationContext.getBean("xsBiz");
    }
　　
　　//略去的代码
　　
    /**
     * 用于javascript soapClient调用接口服务的测试
     * 
     * @param name 名字
     * @return
     */
    public String helloWorld(String name)
    {
        String str = "hello," + name;
        System.out.println(str);
        return str;
    }
　　
    public void destroy()
    {
        super.destroy();
    }

    public void invoke(MessageContext arg0) throws AxisFault
    {
        // TODO Auto-generated method stub
    }
}

这个类继承了importorg.springframework.remoting.jaxrpc.ServletEndpointSupport类，很明显我们是在spring框架下进行开发的，而且这个类中本来还有其他方法，略去。现在只需一个helloWorld()方法来测试即可。Spring相关的配置也略去。

2JavascriptSOAPClient前端调用webService

1)页面helloXeditService.htm

<html>
<head>

<script type="text/javascript" src="../gis/class/jquery-1.2.6.js"></script>
<script type="text/javascript" src="../gis/js.src/xedit.service.js"></script>
<script type="text/javascript" src="../gis/js.src/soapclient21.js"></script>

<!-- 此处略去此理没用到的js -->
<script language="javascript">
		var serviceUrl = "../../services/XeditService";
		var xeditService = new XeditService(serviceUrl);
	/*
	* 均用于测试helloWorld
	**/
	$(document).ready(function(){
		$('#btnTest').click(function(){
			var txtTest = $('#txtTest').val();
			var result = xeditService.helloWorld(txtTest);
			if(result.error){
				alert(result.errorDetail.string);return false;
			}else{
				$('#txtTest').val(result.value);
				alert(txtTest);
			}
		});
	});
	</script>
</head>
<body>
	<div id="mainDiv" style="width:100%;">
		<!-- propertyGrid  -->
		<div id="propertyGridDiv" style="width:350px;">
			<!-- 测试用 -->
		    <table>
		        <tr id="trTest">
		            <td style="border-color:red;"><input type="text" id="txtTest" width="300px";></input></td>
		            <td align="left"><input type="button" id="btnTest" value="测试" ></input></td>
		        </tr>
		    </table>
　　
　　...
　　</body>
　　</html>

该页面也删去了该示例没用到的代码。

1)Xedit.service.js

function XeditService(url){
	this.base = Xedit2ServiceBase;
    this.base(url);
}

XeditService.prototype = new Xedit2ServiceBase;

//helloWorld测试(用于测试JavaScript SOAP Client调用service是否成功)
XeditService.prototype.helloWorld = function(name){
	var param = new SOAPClientParameters();
	param.add('name',name);
	var result = SOAPClient.invoke(this._url, "helloWorld", param, false);
	return result;
　　}
　　//略去不相关的代码
function Xedit2ServiceBase(url){
	this._url = url;
}

Xedit2ServiceBase.prototype.toString = function(){
	return this._url;
　　}
　　//略去不相关的代码

1)页面测试：

输入

点击测试弹出框

输入框回填数据

后台控制台打印

以上测试就完成了JavascriptSOAPClient对webService接口的调用。免去了mvc中的controller部分并且将部分业务代码转移到了js前端来处理。