Getting Started with Coldfusion MX and Flash Remoting

Creating the Client Side Code in Macromedia Flash MX

Create a new Macromedia Flash movie, and then open it up with Macromedia Flash MX. In the folder where you unpacked the ZIP file for this tutorial, find the Macromedia Flash movie named gatewayHelloWorld.fla.

The Macromedia Flash movie we'll create will be simple: it will make a connection to the server, call the method on HelloWorld.cfc (which will load the data from the server), and display it in the output window. First, though, let’s look at the ActionScript for the Macromedia Flash movie. Below is a step-by-step walkthrough of the code. The movie has one frame as shown below.

The ActionScript code is as follows:
#include "NetServices.as"  
#include "NetDebug.as"  
 
function Result()  
{  
 //receives data returned from the method  
 this.onResult = function(result)  
 {  
   trace("Data received from server : " + result);  
 }  
 
 this.onStatus = function(error)  
 {  
   trace("Error : " + error.description);  
 }  
}  
 
NetServices.setDefaultGatewayUrl  
("http://localhost:8500/flashservices/gateway");  
var gw = NetServices.createGatewayConnection();  
var server = gw.getService("com.macromedia.test.HelloWorld",  
new Result());  
server.sayHello();

First, the ActionScript libraries appear in the application code:

#include "NetServices.as"  
#Include "NetDebug.as"
The ActionScript libraries are required, as they contain the ActionScript code and objects necessary to communicate with Macromedia Flash Remoting. NetDebug.as is used to debug the communication between Macromedia Flash and the server. When NetDebug.as is included, you can view all the client/server communication by opening the NetConnection panel within Macromedia Flash MX (Window > NetConnection Debugger).

Next, the movie creates a new ActionScript class, called Result. It uses the methods in an instance of the class to catch and manipulate the data received from the server.

function Result()  
{  
 
 this.onResult = function(result)  
 {  
   trace("onResult : " + result);  
 }  
 
 this.onStatus = function(error)  
 {  
   trace("onStatus called : " + error.description);  
 }  
}

This creates a Result class with two methods. The first method:

this.onResult = function(result)  
{  
 trace("Data received from server : " + result);  
}

retrieves the response from the component on the server. Whenever data from the server loads, it calls the onResult method. In this case, the application code prints the response from the server to the output window in Macromedia Flash MX using the trace() method.

Next, the application code creates a function named onStatus. This is called if an error occurs when trying to load the data from the server. When an error occurs, it's passed to the method. You can access the error description through the description property, as is shown here. In this case, it prints the error message from the server to the output window in Macromedia Flash using the trace() method. The code below illustrates this scenario:

this.onStatus = function(error)  
{  
 trace("Error : " + error.description);  
}

Note that the object that contains the methods does not need to be named Result.