SOAP+Flash 更友好的应用程序

2010-08-28 10:45:06来源:西部e网作者:

 

    利用Flash5的XML能力,用SOAP进行通讯,可以创建Flash界面Web应用程序。SOAP(Simple Object Access Protocal)是通过网络平台在不同的系统间交换数据的方法。SOAP使用XML文档,通过类似于HTTP的协议处理网页的请求和和回应动作。

  由微软的.NET和Apache SOAP看来,SOAP是用来在不同的系统间交换数据协议中是最方便的一种。

  这篇文章中,你可以看到怎样建立一个基于Flash的计算器,并利用SOAP进行远程过程调用(RPC)在服务器上建立简单的计算程序。

  要完成这个例子,你需要安装了Flash5,微软的SOAP Toolkit2.0 SP2,Visual Basic,Windows NT/2000 server和IIS。

  本程序需要建立服务器应用程序和监听器,用来处理所有收到的SOAP请求。这个程序使用了微软的ASP监听器和SOAPCalc ActiveX DLL,这些都可以在微软的SOAP Tookit中找到。

  另外,还需要一个封装了SOAP的Flash组件,这个免费的组件可以在http://software.mrev.com/soap.asp下载到。

  都准备好了之后,让我们开始吧。

  第一步:建立ASP监听器

  在服务器端,需要对进入的SOAP请求进行操作。可以使用ASP文件来处理这些请求。首先,在IIS中建立一个新的目录或是虚拟目录,并命名为SOAPCalc。在这个目录中,建立一个新的ASP文件,并命名为“default.asp”

  输入以下代码:

<%@language=vbscript%>
<%
  Set CalcSrv = Server.CreateObject("SOAPCalc.CalcSrv")
  CalcSrv.Process Request, Response
%>

  这个ASP页面接收从Flash中发送来的SOAP XML请求,并把Request和Response对象传递给CalcServ组件

\
图1

CalcSrv从数据流中读入并解析SOAP请求,完成所需要的计算。并且把ASP的Response对象通过SOAP送到客户端。

\
图2

  客户端的Flash应用程序读取了返回数据,刷新计算器的显示。

    第二步:建立服务器端计算器组件

  下一步,建立服务器端的用来完成计算操作的组件。打开Visual Basic 6,建立一个新的ActiveX DLL工程。

  这个组件和SOAP Toolkit中的“Using a Low Level API for SOAP Messages”这个例子程序是相同的,但是我们把工程的名字改成了SOAPCalc。如果你没有安装Visual Basic,也可以直接下载编译过的CalcServ安装程序(见参考)。安装程序将复制并注册所有需要的文件。本文后面的zip包中有这个例子的VB代码,以及编译好的DLL文件。

  这个演示程序通过SOAP reader对象读取进入的请求。然后,它将检查请求中的SOAP封装是否包含叫做<Add><Subtract>, <Multiply> 或 <Divide>的节点,以及两个子节点<A>和<B>。如果找到了,它将处理请求,并且通过serializer返回SOAP消息和ASP的Response对象。

  因为Flash的XML解析器不能处理XML标记的名称空间,所以,需要使用单一的结构。

  一般的SOAP主体是这样的:

<SOAPSDK1:AddResponse xmlns:SOAPSDK1="uri:Calc">
 <SOAPSDK1:Answer>12</SOAPSDK1:Answer>
</SOAPSDK1:Response>

  但是,由于前述的理由,我们不能直接使用这样的结构。而应该用下面这样Flash支持的语法形式。这种形式包容了同样的数据,只是没有SOAPSDK的名字空间和标记前缀而已。

<AddResponse>
 <Answer>12</Answer>
</AddResponse>

  做这些改变,首先应该从这个模块的代码前端的声明部分去掉下面这行:

Const CALC_NS = "uri:Calc"

  然后,要告诉SOAP Serializer不使用特定的名字空间。把这段代码:

...
Serializer.startBody
Serializer.startElement MethodName & "Response", CALC_NS
Serializer.startElement "Answer", CALC_NS
...

  修改成这样:

...
Serializer.startBody
Serializer.startElement MethodName & "Response"
Serializer.startElement "Answer"
...


  好了,现在可以编译DLL了。然后IIS服务器上注册它。(在控制台或是run对话框中使用regsvr32.exe命令,形式是:regsvr32 DLL所在路径\DLL文件名)

    第三步:建立Flash界面

  前面的两个步骤完成后,就我们继续建立客户端的Flash界面。

  首先,在Flash中建立一个简单的计算器界面。这个界面和普通的数字计算器很相似--用户在键盘上输入数值和计算方法,计算器显示出计算结果。为了能够进行计算,在Flash中需要有一些全局变量来存放数值和计算方法。当用户点击计算器的按钮时,更新这些变量的值。我们用三个root-level变量存放了这些数据:

  _root.calcValue 存放计算器显示的数值

  _root.operator 存放选择了的计算方法

  _root.lastValue 存放上一次运算的结果

  然后需要建立各种与用户交互的按钮,比如0~9的数字,各种运算符,小数点,等号等等。除此之外,还需要建立一个文本框,以便显示计算结果。在Flash中,通过动态文本(Dynamic Text)把变量绑定到文本框上,这个文本框中将显示出变量的值,并随变量的变化而刷新。(方法是:从text options面版中选择Dynamic Text,设置bind variable为 _root.calcValue。)

  下一步,为每个按钮建立相应的Action:当数字按钮被按下的时候,更新变量 _root.calcValue 的值,当运算符按钮被按下时,设置变量_root.operator的值。这个值要和服务器端的SOAPCalc 组件所需要的值保持一致。(本例中是"Add", "Subtract", Multiply", 或 "Divide")同样在这个Action中,添加代码用来把当前的计算结果保存到变量_root.lastValue中。运算符按钮的Action中应该有这样的代码:

on (release) {
 // operator应该是 "Add", "Subtract", Multiply", 或 "Divide"
 _root.operator = "Add";
 _root.lastValue = _root.calcValue;
 ...
}

  下面,添加"="按钮的Action,当用户按下这个按钮的时候,将调用函数发送SOAP消息,进行计算:

on (release) {
 _root.calculate(_root.operator, _root.lastValue, _root.calcValue);
}

  在Flash影片的root level中的新层中,建立一个所有函数都将用到的Action。在这个Action中,建立一个函数calculate()处理SOAP请求和回应。函数calculate()的作用是向服务器发送运算所需要的两个数和运算符。

  其形式是:

function calculate(operator, a, b) {
...
}

  具体的代码将在下面的部分继续填充。

    第四步:实现SOAP消息

  其实这样功能的计算器使用Flash集成的脚本语言ActionScript就可以轻松完成,但是我们这里演示的是SOAP计算器,所以需要利用服务器完成所有的计算请求。Flash5能够发送和接受XML文档,而SOAP消息也是普通的XML文档,所以我们可以使用Flash集成的XML对象来建立和解析SOAP消息。

  为了使建立Flash/SOAP应用程序的过程更为简单,你可以下载Media Revolution所开发的Flash SOAP组件。它是免费的。这个组件通过封装XML操作而简化了在Flash中发送和接受SOAP消息的操作。可以从http://software.mrev.com/soap.asp下载这个组件。使用方法是把它复制到Flash影片所在目录,在root level加入一个名为SOAP的影片夹子,并加入如下代码:

loadMovie ("SOAP.swf", "_root.SOAP");

  在函数calculate()中使用这个SOAP对象。首先,创建一个新的SOAP对象。注意名称"SOAP"要和上一步加入的SOAP组件名称相同。

  为这个对象的onLoad属性分配一个函数名。这个函数在SOAP对象接受或处理SOAP回应时运行。(函数displayCalcResult将在后面定义)。

  代码如下:

function calculate (operator, a, b) {
 ...
 var SOAPCalc = new SOAP.SOAP();
 SOAPCalc.onLoad = displayCalcResult;
...
}

  然后,使用内建的SOAP方法createMethod() 和 addParameter() 定义远端过程调用的类型。SOAP对象假定服务器应用程序期望的节点和调用的方法同名。并且返回一个名称为[方法名]Response的节点。 (比如 AddResponse)。
代码如下:

function calculate (operator, a, b) {
 ...
 SOAPCalc.createMethod(operator);
 SOAPCalc.addParameter("A", a);
 SOAPCalc.addParameter("B", b);
 ...
}

  最后,使用SOAP对象的方法send(),把请求发送到前面建立的SOAP监听器的地址上。

function calculate (operator, a, b) {
...
SOAPCalc.send
("http://localhost/SOAPCalc/default.asp");
...
}

  注:因为安全问题,Flash播放器限制SOAP请求和影片在一个子域中。Macromedia将发布一个修正版的播放器,以便解决这一问题。

  当SOAP对象收到和解析服务器发回的回应,onLoad事件将被触发。通过前面分配给onLoad属性的函数,可以很容易的存取服务器的回应信息。比如:

function displayCalcResult () {
 _root.calcValue = this.Response.Answer;
}

  SOAP Response对象中的[函数名]Response.Answer节点中存放的就是计算结果。

  回应的SOAP消息如下所示:

<SOAP-ENV:Envelope xmlns:
 SOAP-ENV=\"http://schemas.xmlsoap.org/soap/envelope/\">
 <SOAP-ENV:Body>
  <AddResponse>
   <Answer>10</Answer>
  </AddResponse>
 </SOAP-ENV:Body>
</SOAP-ENV:Envelope>

  上面的displayCalcResult()远程操作返回的值存放在root-level的变量 _root.calcValue中,这样动态文本框将自动显示其值。

  这些都做好以后,你就拥有了一个Flash SOAP计算器了。完整的演示可参见:http://software.mrev.com/demo/soap

  关于错误处理,请解析<Fault>节点的子节点<faultcode>和其他节点,它们包含了错误信息:

<?xml version="1.0"?>
<SOAP-ENV:Envelope>
 <SOAP-ENV:Body>
  <SOAP-ENV:Fault>
   <faultcode>Server</faultcode>
   <faultstring>
    Parameter missing: B
   </faultstring>
  </SOAP-ENV:Fault>
 </SOAP-ENV:Body>
</SOAP-ENV:Envelope>

  通过Flash使用SOAP传递信息,把用户界面和数据分离,是一个不错的主意。这样客户端可以得到比以往的Web界面更丰富的多媒体界面。通过在Flash函数内封装SOAP请求和SOAP组件,大大降低了开发难度,甚至可以让对XML和SOAP不很熟悉的Flash开发人员轻松的应用。

关键词:Web