The AS3 framework provides a whole bunch of classes to allow you to call http web services, for example a PHP page which generates XML.

I wanted to migrate an application written in AS2 working with PHP methods that Flash 7 called via Flash Remoting.

Flash Remoting, it’s a collection of code allowing Flash to easily call PHP methods (or even other languages) without having to worry about object types during the transfer of data between the server and the client-side animation.

This tutorial describes how to use Flash Remoting in AS3 and thus how to migrate your old work in AS1 and AS2 into Flex 2 with rewriting the server-side methods.

This tutorial is built and tesed in Flex Builder 2 (release 2.0.143459), on WinXP with Flash Player 9.0.16.

In Flex, right-click in the windows

File > New Flex Project (Data access: click Basic) > Next > Name the project FlashRemotingAS3 > Finish.

You should have a file called FlashRemotingAS3.mxml.

Download AMFPHP from http://www.amfphp.org. Unzip the file, it should contain 11 folders (actions, adapters, app, browser, debug, exception, extra, filters, io, services, util) and one file (gateway.php)

We’re going to base our example on the use of AMFPHP but it’s also possible to use other solutions which use the AMF protocol (Java, .NET, etc)

Open the file gateway.php, and at line 105, note the following code :

$gateway->setBaseClassPath("services/");

The directory services contains the other 11 folders beneath it, and there are no files in it yet. It’s here that you put your files containing your PHP service classes. These PHP service classes contain methods (PHP) that can be called from Flash. To simplify things, leave this default setup alone and do not modify setBaseClassPath !

In the /services folder create a PHP class file called Sample.php and put the following code in it :

<?
class Sample{
 
	// Constructor
 
	function Sample(){
		$this->methodTable = array(
			"response" => array("access" => "remote")			
		);	
	}
 
	function response($pValue){
		return "\nThe client sent : [".$pValue."]\nThe server got it!!!";
	}
}
?>

Deploy the 11 folders plus the gateway.php file in a folder caled “remoting� on your PHP server, localhost for example.

Note : you can use WAMP Server to test your application locally. We’re done with the server-side part. So far we have :

1 – Installed the PHP files allowing the remoting mechanism to work (call from Flash, processed by PHP, which executes the called methods, and returns to Flash in an asynchronous mannner)

2 – Created a service called Sample with a method called respond, which takes a String parameter sent by Flash and returns the same variable preceeded by the message The client sent : and followed by The server got it !!!

This test allows us to verify that the call to the server worked.

The AS2 class mx.remoting.Service is not available in the AS3 framework or in the mx library from Adobe.

Adobe generously provide an equivalent class : the RemoteConnection class. You can download this class from on the DevNet site of Adobe

We now have to create a new class in the Flex project that we created at the start of this tutorial. Right-click the root of the project in the Navigator window and select New Class.

You’re now going to create the RemotingConnection class. Copy and paste the following code :

package 
{
    import flash.net.NetConnection;
    import flash.net.ObjectEncoding;
 
    public class RemotingConnection extends NetConnection
    {
    public function RemotingConnection( sURL:String )
        {
            objectEncoding = ObjectEncoding.AMF0;
            if (sURL) connect( sURL );
        }
 
        public function AppendToGatewayUrl( s : String ) : void
        {
            //
        }
    }
}

Go back to Flex, and edit the source of the file FlashRemotingAS3.mxml.

We’re going to put in the minimum to enter into an AS3 class once the SWF launches. The subject of the tutorial isn’t really XML or components, but the remote access of PHP methods.

Copy this code:

<samples:SampleApplication 
	xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" 
	xmlns:samples="net.thibaultmonereau.samples.*" verticalAlign="middle">
</samples:SampleApplication>

The samples tag defines the namespace which I’ll work in for this tutorial. It’s defined by the xmlns attribute, and tells the compiler that all the samples tags are defined in classes in the folder net/thibaultmonereau/samples/ contained in one of the classpaths of the project.

Right-click the root of the project and create the following folder structure : net/thibaultmonereau/samples

I could have put the AS3 class at the root of the project, but I like to organise things!!!

In the MXML I put the root tag <sample:SampleApplication>. This tells the compiler to go and look for a class called SampleApplication in the net.thibaultmonereau.samples package. Let’s create this class.

Right-click on the samples folder, New ActionScript class, called SampleApplication, it inherits from the class mx.core.Application.

I propose some simple coding : a text field where we can type a message, for example hello, and a button Send. On clicking Send, Flash calls the PHP server called Sample, and the response method is passed a parameter which is the contents of the text field. If the round-trip works, a Flash Alert should appear with onResult, Client sent : [Hello]. The server got it !!!*.

At line 78 of the following code, don’t forget to change www.myserver.com by the name of your server (localhost, localhost :1234 or the name of your actual server )

package net.thibaultmonereau.samples
{
	import flash.events.KeyboardEvent;
	import flash.events.MouseEvent;
	import flash.net.Responder;
 
	import mx.containers.Panel;
	import mx.controls.Alert;
	import mx.controls.Button;
	import mx.controls.DataGrid;
	import mx.controls.Label;
	import mx.controls.TextInput;
	import mx.core.*;
	import mx.events.FlexEvent;
	import mx.skins.halo.HaloBorder;
	import mx.styles.StyleManager;
 
	public class SampleApplication extends Application
	{
 
		private var _input : TextInput = null;
 
		/**
		 * Constructor function
		 * @param None
		 * @return SampleApplication
		 */
		public function SampleApplication()
		{
			//TODO: implement function
			super();
			layout = "vertical";
			setStyle("borderSkin",mx.skins.halo.HaloBorder);			
			addEventListener(FlexEvent.APPLICATION_COMPLETE, doInit);
 
		}
 
		/**
		 * <br> Application initialisation
		 * @param e (FlexEvent)
		 * @return Void
		 */
		private function doInit(e:FlexEvent) : void {
			this.doDraw();
		}
 
		/**
		 * <br>Draw method of the Application
		 * @param None
		 * @return void
		 */
		private function doDraw() : void {
 
			var p : Panel = new Panel();
			p.title = "Type a message to send to the Flash Remoting server, and AMFPHP ! ";
 
			var l : Label = new Label();
			l.text = "Your message : ";
			var t : TextInput = new TextInput();
			this._input = t;
 
			var b : Button = new Button();
			b.label = "Send";
			b.addEventListener( MouseEvent.CLICK, this.doSend );
			this.addChild(p);
			p.addChild(l);
			p.addChild(t);	
			p.addChild(b);
		}
 
		/**
		 * <br>Send a String to the PHP service, and handle the callback
 
(onResult, onFault) of this request
		 * @param e (MouseEvent)
		 * @return void
		 */
		private function doSend( e : MouseEvent ) : void {
 
			var	gateway : RemotingConnection = new  RemotingConnection( "http://www.myserver.com/remoting/gateway.php" );
                gateway.call( "Sample.response", new Responder(onResult, onFault), this._input.text );
		}
 
		private function onResult ( result : Object ) : void {
			Alert.show("onResult\n" + result);
		}
 
		private function onFault ( fault : Object ) : void {
			var s : String = "";
			for( var i : String in fault ) {
				s+= i + " " + fault[i]  + "\n";
			}
			Alert.show("onFault\n"+s);
		}		
	}
}

Normally, everything should work. In case of problems, an alert with the relevant details should pop up !

Deploy the SWF and the accompanying HTML page on your server (the PHP services were deployed before). Retest… that it gives you this : http://www.thibaultmonereau.net/samples/fp/fp9/FlashRemotingAS3/MonApplicatoin.html

This is the first tutorial that I’ve written… so if there are any problems write to me in the forum.

media-box : mrvertigo.

Update : (version 1) by eKameleon :)