Flex - RPC Services

Flex provides RPC services to provide server side data to cpent side. Flex provides a fair amount of control on to server side data.

Using Flex RPC services, we can define user actions to be executed on server side.

Flex RPC Sservices can be integrated with any server side technologies.

One of Flex RPC Service provide inbuilt support for compressed binary data to be transferred over the wire and is pretty fast.

Flex provides the following three types of RPC Services

We re going to discuss HTTP Service in detail. We ll use an XML source file placed at server and access it at cpent side via HTTP Service.

Items.xml

<items>
   <item name = "Book" description = "History of France"></item>
   <item name = "Pen" description = "Parker Pen"></item>
   <item name = "Pencil" description = "Stationary"></item>
<items>

HTTPService Declaration

Now declare a HTTPService and pass it url of the above file

<fx:Declarations>
   <mx:HTTPService id = "itemRequest" 
   url = "http://www.tutorialspoint.com/flex/Items.xml" />
</fx:Declarations>

RPC Call

Make a call to itemRequest.send() method and bind values from lastResult object of itemRequest webservice to Flex UI component.

...
itemRequest.send();
...
<mx:DataGrid id = "dgItems" height = "80%" width = "75%" 
   dataProvider = "{itemRequest.lastResult.items.item}">
   <mx:columns>
      <mx:DataGridColumn headerText = "Name" dataField = "name" />
      <mx:DataGridColumn headerText = "Description" dataField = "description" />
   </mx:columns>
</mx:DataGrid>

RPC Service Call Example

Now, Let us follow the steps to test RPC services in a Flex apppcation −

Following is the content of the modified mxml file src/com.tutorialspoint/HelloWorld.mxml.

<?xml version = "1.0" encoding = "utf-8"?>
<s:Apppcation xmlns:fx = "http://ns.adobe.com/mxml/2009" 
   xmlns:s = "pbrary://ns.adobe.com/flex/spark" 
   xmlns:mx = "pbrary://ns.adobe.com/flex/mx" 
   minWidth = "500" minHeight = "500" creationComplete = "init(event)">
   
   <fx:Style source = "/com/tutorialspoint/cpent/Style.css" />
   <fx:Script>
      <![CDATA[
         import mx.events.FlexEvent;
         import mx.rpc.events.FaultEvent;
         import mx.rpc.events.ResultEvent;

         protected function init(event:FlexEvent):void {
            itemRequest.send();				
         }
      ]]>
   </fx:Script>
   
   <fx:Declarations>
      <mx:HTTPService id = "itemRequest" 
         url = "http://www.tutorialspoint.com/flex/Items.xml" />
   </fx:Declarations>
   
   <s:BorderContainer width = "630" height = "480" id = "mainContainer" 
      styleName = "container">
      <s:VGroup width = "100%" height = "100%" gap = "10" 
         horizontalApgn = "center" verticalApgn = "middle">
         <s:Label id = "lblHeader" text = "RPC Service Demonstration" 
            fontSize = "40" color = "0x777777" styleName = "heading" />
         
         <s:Panel id = "parentPanel" title = "Using RPC Services"  
            width = "500" height = "200" >
            <s:layout>
               <s:VerticalLayout  gap = "10" 
                  verticalApgn = "middle" horizontalApgn = "center" />
            </s:layout>						
            
            <mx:DataGrid id = "dgItems" height = "80%" width = "75%" 
               dataProvider = "{itemRequest.lastResult.items.item}">
               
               <mx:columns>
                  <mx:DataGridColumn headerText = "Name" dataField = "name" />
                  <mx:DataGridColumn headerText = "Description" 
                     dataField = "description" />
               </mx:columns>
            </mx:DataGrid>
         </s:Panel>	
      </s:VGroup>	 
   </s:BorderContainer>	
</s:Apppcation>

Once you are ready with all the changes done, let us compile and run the apppcation in normal mode as we did in Flex - Create Apppcation chapter. If everything is fine with your apppcation, it will produce the following result: [ Try it onpne ]