Flex Easily Uses Web Services to Get and Change Data on Remote Servers
Flex applications, whether in the browser or on the desktop, run on the client side. Thus, there are no special server-side components necessary when building Flex applications. However, most Flex applications get data from remote servers, make changes to that data and then submit those changes back to the server.
Flex provides many ways to load and manipulate remote data. Most of these methods are simple and can work with any backend technology such as .Net, Java, Ruby, Python, PHP, etc.,as long as the back-end logic is exposed through some kind of web service. Web services is a broad term which can mean SOAP, RESTful, JSON, XML-RPC, and more. Flex can easily connect to any of these web services.
General Purpose HTTP Networking
HTTPService is the easiest way for a Flex application to make network requests. It makes an HTTP request to a server and returns the results. This simple example makes a request for an XML file located at http://FirstStepsInFlex.com/bookmarks.xml
<mx:Application name="UsingHTTPService"
xmlns:mx="http://www.adobe.com/2006/mxml"
applicationComplete="srv.send()">
<mx:HTTPService id="srv"
url="http://FirstStepsInFlex.com/bookmarks.xml"/>
<mx:DataGrid
dataProvider="{srv.lastResult.bookmarks.item}"/>
</mx:Application>
The HTTPService url property is set to the URL of the file we are requesting. After the application has finished initializing, the applicationComplete event is dispatched, which goes to the event handler of the same name, which calls srv.send(). The meaning of "send" here is "send the request to the server." You can send request parameters as arguments to the send() method.
The DataGrid displays the results of the request by binding to srv.lastResult, which is dynamically set when the response comes back from the server.
By default the srv.lastResult comes back as objects, which the HTTPService automatically converts from XML. What does this mean? Each XML node becomes an object, which contains other objects. If a node contains multiple subnodes, you end up with an array. If a node is just names and properties, thenthat node becomes an Object with corresponding keys and values. This algorithm repeats to the depth of your XML tree.
You can also set the HTTPService resultFormat property to "e4x" in which case the results will be kept as native XML objects for use in E4X expressions. Or you can set resultFormat to "text" which allows for custom deserializers like JSON.
Binding to the lastResult is the simplest way to get the results of a network request. You can also write a result event handler and attach it to the HTTPService:
<mx:Application name="HTTPServiceResultHandler"
xmlns:mx="http://www.adobe.com/2006/mxml"
applicationComplete="srv.send()">
<mx:HTTPService id="srv"
url="http://FirstStepsInFlex.com/bookmarks.xml">
<mx:result>
dg.dataProvider = event.result.bookmarks.item;
</mx:result>
</mx:HTTPService>
<mx:DataGrid id="dg"/>
</mx:Application>
Note that the DataGrid isn't configured with a dataProvider. Instead, this happens in the result event handler, which is written as a script block.
HTTPService also has a fault event for requests that return errors.
SOAP Web Services
The WebService component connects to a remote server using SOAP:
<mx:Application name="UsingSOAP"
xmlns:mx="http://www.adobe.com/2006/mxml"
applicationComplete="srv.GetInfoByZIP(94103)">
<mx:WebService id="srv"
wsdl="http://www.webservicex.net/uszip.asmx?wsdl">
<mx:operation name="GetInfoByZIP">
<mx:result>
dg.dataProvider = event.result.NewDataSet.Table
</mx:result>
</mx:operation>
</mx:WebService>
<mx:DataGrid id="dg"/>
</mx:Application>
![Hot Tip](/storage/rc-covers/7084-thumb.png)
If you get an error when running this program, close all instances of your browser and try again. For an explanation, refer to the following Networking Limitations section.
SOAP defines operations that are specified by its WSDL (Web Services Description Language). Once we set the wsdl property of the WebService to the remote WSDL URL, those operations can be called on the WebService object as if they were native methods of that object (this is one of the many benefits of using a dynamic language).
Here, the call to the WebService method GetInfoByZip() takes a single parameter. The result event handler puts the data returned from the request into the DataGrid. Data binding can also be used with the results of the request by binding to the srv.GetInfoByZIP.lastResult.NewDataSet.Table property.
Networking Limitations
The browser imposes several limitations on the networking capabilities of the Flash Player. The primary limitation is that applications running in the Flash Player can only make requests back to the server from which the application originated.
There are two workarounds:
- Use a proxy server on the server from which the application originated from.
- Use cross-domain requests.
Any server can act as a proxy. Apache is easy to configure as a proxy, as is the open source BlazeDS server (a subset of the LiveCycle Data Services product).
To enable cross-domain requests, server administrators must explicitly allow them. Unfortunately, this can open web sites to XSRF types of attacks. During development testing, the Flash Player lets you bypass this security restriction for specific applications. This happens automatically when developing Flex application in Flex Builder. It can also be done manually by modifying the Flash Player's trust file. For more information, see http://FirstStepsInFlex.com/go/FlashPlayerTrustFile
Another limitation of the networking capabilities of Flash Player is that non-200 HTTP response codes cannot be accessed in the Flash Player. This is due to limitations in the browsers' Plug-in networking APIs. Either insure that all responses from your server are 200, or utilize a proxy.
Further Learning
The open source AS3Corelib library adds JSON support to HTTPService:http://FirstStepsInFlex.com/go/as3corelib
Flex Builder 3 supports a new technique for working with SOAP web services which stubs out the ActionScript objects for a given WSDL. This feature is available in Flex Builder from the Data menu: http://FirstStepsInFlex.com/go/WSDLImport
More information on HTTPService and WebService: http://FirstStepsInFlex.com/go/WebServices
{{ parent.title || parent.header.title}}
{{ parent.tldr }}
{{ parent.linkDescription }}
{{ parent.urlSource.name }}