Flex HTTPService with PHP

I honestly feel that the next big wave of internet applications will be RIA's (Rich Internet Applications). Frameworks such as Flex, which now carries Adobe's name despite being an open source ria framework, or Microsoft's Silverlight have the capability to produce nice, clean client side applications. But with client side apps comes a problem: delay. Flex doesn't really have any libraries made for accessing databases of any type. So we, as developers, usually have to rely on some type of server side script or program to access the database and give it back to the Flex application. All of this is well documented on Adobe's site, but I would really like to talk about it here.

As you can imagine actions which take place on the client side occur instantaneously and actions which take place server side don't. So where do we merge the gap? When I first started working in Flex several months ago I had only played around a bit with the ResultEvent library. But it is incredibly useful and almost necessary for effective client-server communication. Take for example a login form built in flex with just three components: a username field, a password field, and a submit button. Normally with HTML PHP login scripts you can use post variables to verify login information after polling the database to see if the information lines up. In Flex it is not quite as simple, but still very straight forward. In Flex you would simply create the form, create a HTTPService request to send the form information to the PHP script, use PHP to poll the database and return some type of data back. I'll go into the return data later but for now lets dive into the HTTPService request itself.

The HTTPService tag is very straight forward:

<mx:HTTPService></mx:HTTPService>

Now I've introducted several new key attributes to the HTTPService tag:

1. id - This is exactly like the HTML or XHTML version of id and should be used for every component in a Flex app.
2. url - attribute is key to the HTTPService tag as it will specify the URL to send the HTTP request to.
3. result and fault - each one has its own special method for handling its respective function. The result attribute will send information to the someNameResultHandler method based on when the HTTP request returns from the server. The same goes for the fault attribute but it will only be used if nothing is returned or if the request could not be completed (no network connectivity, couldn't access the file, etc).

Now lets go deeper into the HTTPService request.

<mx:HTTPService id="someName" url="http://www.somedomain.com/someScript.php" result="someNameResultHandler(event);" fault="someNameFaultHandler(event);">
<request xmlns="">
<someObject<{someValue}</someObject>
</request>
</mx:HTTPService>

We've not introducted two new tags one is the request parameter which tells the HTTPService object you'll be sending data along with this request. The other, someObject is a XML tag relating to a value that will be sent with the request. In this case that value is someValue and it could be a string, a character, a number, anything. It doesn't really matter what it is just that you know that when it is sent that value will go with it and can be referenced in the PHP script as $_POST["someObject"].

For the PHP script I will just do something very simple. I'll assume that you know how to write a script to access a database and put the values into an object and get each row. There are several different ways you can use PHP and Flex. A lot of people use AMFPHP or JSON which is Java based, but in this example I will only be showing the use of PHP to format and return XML.

<?php
// Lets assume that the someObject is a boolean value of true or false

$output = "<valid>";// This output variable will hold the xml we are creating with a tag called valid
if($_POST["someObject"]){
$output .= "yes";
}
else{
$output .= "no";
}
$output .= "</valid>";

print($output); // This will print out the XML we just made for the calling HTTPService request
?>

This is an incredibly straight forward PHP script that will just return yes or no wrapped in XML based on a true or false value of someObject. Easy enough? Now what do we do with it? Normally in order to start an HTTP request in Flex you would use the id of the value and the send method.

someName.send();

Easy enough. That line of code simply executes the HTTPService request and is finished, but not in our case. We want information back and because we're working with server-side scripting we want to know WHEN it gets back! This is going to be handled with our result and fault handler methods. Here is their form in Flex. This is of course in ActionScript.

<mx:Script>
<![CDATA[
import mx.rpc.events.ResultEvent;
import mx.rpc.events.FaultEvent;

private function someNameResultHandler(event:ResultEvent):void{
// To access the information that was just returned in the event you would use the event.result property. The result will hold any information you have I'm going to go ahead and use an Alert box in flex just for simplicity.

mx.controls.Alert.show("The service request returned: " + event.result.valid, "Alert Box"); // This will display an alert box with the yes or no inside of it based on the event.result.valid property. .valid is actually the name of the XML parameter we returned with the PHP.
}

private function someNameFaultHandler(event:FaultEvent):void{
mx.controls.Alert.show("There was some kind of error in the request.", "Error"); // This will only be displayed in the event that the HTTPService request cannot be completed.
}
]]>
</mx:Script>

How easy was that!? Pretty simple I'd say. That's all you need to create a Flex HTTPService request that will access a PHP script and wait for the result.

Hope it was useful! As always, happy coding.