Drive your Flash Front-Ends with SOAP

Drive your Flash Front-Ends with SOAP (cont.)

Step 4: Implement SOAP messaging
Rather than using Flash's built-in JavaScript-derivative scripting language, ActionScript, to perform operations, the SOAP calculator hands off all its arithmetic requests to the SOAP-savvy server application, taking advantage of Flash 5's ability to post and receive XML documents. Because SOAP messages are nothing more than a specialized kind of XML document, you could manually build and parse SOAP messages using Flash's built-in XML object. To learn more about creating, sending, and receiving XML from Flash, see my earlier DevX article Power up Your ASP Front Ends with Flash.

To facilitate the creation of the calculator and any other Flash/SOAP application, you can take advantage of a free Flash SOAP component developed by Media Revolution. This component greatly simplifies the process of sending and receiving SOAP messages in Flash by wrapping all the XML manipulation and transmission and exposing only the properties pertinent to the SOAP request. To use the component, download it, and copy it into the same directory as your Flash movie. Add a movie clip to the root level of the Flash movie. Inside that clip, place the following ActionScript:

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

Insert the movie clip onto the stage of the calculator movie and give it the instance name "SOAP." Then follow this process to use the SOAP object inside the calculate() function.

First, instantiate a new SOAP object. Note that the object name "SOAP" corresponds to the movie clip instance that houses the loaded SOAP component. Then assign a method name to the object's onLoad property. This method fires after the SOAP object receives and processes the SOAP response (you will define this function later in this article).

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

Next, use the built-in SOAP methods createMethod() and addParameter() to define the type of remote procedure call you wish to perform. The SOAP object assumes that the server application expects a node with the same name as the method you are calling, and returns a node of the form [methodname]Response (e.g. AddResponse). This is fairly standard SOAP syntax.

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

Finally, use the SOAP object method send() to send the request to the HTTP address of the SOAP listener you created earlier.

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

For security reasons, the current Flash player limits SOAP requests to the same subdomain as the requesting movie; however, Macromedia plans to release a revision of the player that will allow requests to remote addresses without compromising security.

After the SOAP object receives and parses a response from the server, it fires the onLoad event you attached to your object. Inside the function you defined, you can easily access the server response via properties on the object reference this:

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

The SOAP Response object has properties corresponding to each node the server application sent on the [methodname]Response node of the SOAP Body. If no response was received, the entire object will be null. In the example above, the object property .Response.Answer corresponds to the innermost node of a SOAP message like this one:

   <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>

The displayCalcResult() function above sets a root-level variable equal to the result of the remote operation; a dynamic text box will display this value automatically.

After you fill in the interface and display details of your choosing, you will have a working Flash SOAP Calculator. You can view the demo that accompanies this article at http://software.mrev.com.

The SOAP spec returns errors in a Fault tag inside the SOAP Body. To look for these errors, parse the <Fault> node for child <faultcode> and nodes, which contain the error information:

   <?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>

Possible Extensions
After you have established a server listener and a SOAP parser for incoming requests to one application, you can easily extend them to support many applications at once. For applications more complex than the simplistic arithmetic calculator shown here, you could develop one SOAP component that passes off requests to appropriate applications, proxying requests and responses through a single ASP/COM interface. Naturally, SOAP listeners and applications on other platforms would work equally well.

While the version of the SOAP Flash component used here is basic, advanced SOAP features like faults and headers can be accessed on the raw SOAP responses, available via the Flash SOAP object property .Response.XML.

In addition to performing remote procedure calls between unknown systems, using SOAP from Flash is a great way to simplify the transmission of information from complex application servers to a rich-media front-end. By wrapping SOAP requests inside Flash functions, either with the SOAP component or manually, you eliminate the need for Flash developers to know either SOAP or XML. This makes it a perfect tool for Flash developers with only basic programming knowledge. Giving your Flash interfaces access to SOAP data gives you a clean way of separating the user interface from the data.

Ian Bogost is the director of technology for Media Revolution, an integrated marketing agency in Santa Monica, CA. Ian creates rich user experiences that fuse content delivery, functionality, and marketing messaging for the entertainment and advertising industries. Ian has worked on numerous distinguished projects for high profile clients, including DreamWorks SKG, Sony Pictures Digital Entertainment, TBWA/Chiat/Day and Nissan. You can reach him via e-mail at ibogost@mediarevolution.com.

Step 3: Create the Flash Interface

Introduction

Introduction	Step 1: Create the ASP Listener	Step 2: Build the Server Calculator Component
Step 3: Create the Flash Interface	Step 4: Implement SOAP messaging

TALK BACK

Did you know that Flash 5 was capable of making SOAP calls to server-side code? Using Flash 5's XML capabilities, you can build highly interactive thin-client applications? Let us know what you think of the techniques in this article? Join the discussions at web.server.general and let us know.