Home > Flex, tutorial > BlazeDS with Remote Objects example

BlazeDS with Remote Objects example

February 1st, 2009

In my previous tutorial on BlazeDS, I went over an example over how to setup remote objects with data push. There are however, a lot of instances where someone just wanted to receive data and they aren’t concerned with it being updated., so it turns more into a ‘client requesting data whenever it wants it’ scenario. This article will not be nearly as indepth as the last blazeDS article, but if you have not setup your environment for BlazeDS before, it will probably be in your best interest to check it out.

Lets begin by making sure that we have our server and BlazeDs war file. Both of them can be found here:

Tomcat 6
BlazeDS

Once again, we are going to extract the contents into our BlazeDS server project. This time, we are only going to edit remoting-config.xml. Make sure that the following lines are in there.

<default-channels>
   <channel ref="my-amf"/>
</default-channels>
<destination id="BlazeDsService"> 
  <properties> 
     <source>com.codeofdoom.BlazeDsService</source> 
  </properties> 
</destination>

We tell the remoting-config to use the channel “my-amf”, which is already defined with the services-config.xml file. Next we are telling it to use the the destination “BlazeDsService”. This is what our remote object will be looking at. The properties also contains a source. This source is going to be a java class with the methods it needs in order to process the calls from the front end. You must make sure you include the fully qualified name, so we will call it com.codeofdoom.BlazeDsService. So what does this file look like?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
package com.codeofdoom;
 
import java.util.ArrayList;
import java.util.List;
import java.util.Random;
import flex.messaging.io.ArrayCollection;
 
public class BlazeDsService {
    private static final String[] MASTER_LIST = {"C", "FNM", "FRE", "F", "GOOG", "AIG", "CSCO", "MSFT", "AAPL", "YHOO", "BSX", "PORT","F", "TNT", "ESP", "RET", "VBN", "EES"};
    public BlazeDsService(){}
    public List<StockQuote> getQuotes(){
        List<StockQuote> list = new ArrayList<StockQuote>();
        Random r = new Random();
        for (String s:MASTER_LIST){
            StockQuote sq = new StockQuote();
            sq.setName(s);
            sq.setPrice(r.nextInt(50));
            list.add(sq);
        }
        return list;
    }
}

Yep. Thats it. It not implementing anything crazy, not extending any service adapters, anything like that. It’s just a java class with some functions on it. Next we are going to create the object that we will be sending back and forth. In this example, we are going to be simulating retrieving some stock data, so I called the class StockQuote.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
package com.codeofdoom;
 
public class StockQuote {
    private String name;
    private int price;
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public int getPrice() {
        return price;
    }
    public void setPrice(int price) {
        this.price = price;
    }
}

On the front end, we are going to need the matching object, and here that is.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
package com.codeofdoom.dto
{
    [Bindable]
    [RemoteClass(alias="com.codeofdoom.StockQuote")]
    public class StockQuote{
        private var _name:String
        private var _price:int;
 
        public function get name():String{
            return _name;
        }
        public function get price():int{
            return _price;
        }
        public function get name(name:String):void{
            _name = name;
        }
        public function get price(price:int):void{
            _price = price;
        }
    }
}

I mentioned this in the last article, but I am going to mention this again, just to stress the importance. When we are using Remote Object, we must make sure that

  • All the properties are the same.
  • We have getters and setters for all properties on back the java side and the AS side.
  • We must have our AS object set as Bindable and the RemoteClass set to the path of our remote object.
  • We must make sure that the constructors match. I have seen where flex will swallow the error message if they don’t match, making debugging a pain.

Now lets take a look at the mxml.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Script>
        <![CDATA[
            import mx.rpc.events.ResultEvent;
            import mx.collections.ArrayCollection;
            import mx.messaging.messages.IMessage;
            import mx.messaging.events.MessageAckEvent;
            import mx.messaging.messages.AsyncMessage;
            import mx.messaging.events.MessageEvent;
 
            public function retrieveStocks():void{
                ro.getQuotes();
            }
            private function result(e:ResultEvent):void{
                stockChart.dataProvider = e.result as ArrayCollection;
            }
        ]]>
    </mx:Script>
    <mx:RemoteObject id="ro" result="result(event)" destination="BlazeDsService"/>
    <mx:VBox width="100%">
        <mx:BarChart width="100%" id="stockChart">
            <mx:horizontalAxis>
                <mx:CategoryAxis categoryField="name"/>
            </mx:horizontalAxis>
            <mx:series>
                <mx:ColumnSeries xField="name" yField="price"/>
            </mx:series>
        </mx:BarChart>
        <mx:Button label="Retrieve Stocks" click="retrieveStocks()"/>
    </mx:VBox>   
</mx:Application>

Once again, not much to it. There are three areas of importance.

  • Our remote object is that is subscribed to our destination that we declared within our remoting-config.xml.
  • The retrieveQuotes function is what calls our backend. Note that it just calls ‘getQuotes’ directly from the remote object.
  • The result function that is set on the RemoteObject is what comes back from the back end. Now a lot of examples will do something to the grid such as dataprovider = {ro.getQuotes.lastResult}. We could do the same here, but i wanted to give you a chance to inspect the object to see what exactly is coming back.

Once you click the Retrieve Stocks button, it then calls the getQuotes() function on the remote object. That then builds our List of objects and passes them to the front end. When it comes back, we then just apply it to the dataprovider of our chart.

I really wanted to take the time out to show you some other ways of handling your data within BlazeDS. It is an extremely powerful tool that every Flex developer should have under their belt. Its a lot less cumbersome than standard calls to the back end and the amount of data that is sent back and forth is a lot smaller than sending plane XML over the wire. Good luck!

Here is the source

Flex, tutorial , , ,

  1. May 8th, 2009 at 17:01 | #1

    Nice Post …

  2. ukdavo
    November 8th, 2009 at 17:09 | #2

    Just wanted to say thanks v much for the article. I was wondering why my code wasn’t working then I saw your warning about matching getters/setters, etc – exactly what I needed!

  3. Chris
    February 12th, 2010 at 08:32 | #3

    Fantastic tutorial. One small (possible) problem. You have 4 “getters” in your StockQuote.as

    Shouldn’t there be 2 getters and 2 setters?

  4. mas
    August 6th, 2010 at 16:08 | #4

    Thanks for posting this. I tried it on my Flash Builder 4 and worked great.

  5. Anonymous
    August 13th, 2010 at 11:48 | #5

    @Chris
    yes it’s a mistake

  6. Anonymous
    August 30th, 2010 at 03:00 | #6

    whether we can use streamingamf channel for remoteObject call?

  7. Raj
    October 31st, 2010 at 15:59 | #7

    Hi i have tried but when i clicked the button ‘Retrieve Stocks’ nothing happed.I am not able to understand what wrong with it.

    The steps i am follow
    1. In remoting-config.xml file i add

    com.codeofdoom.BlazeDsService

    2. I put 2 java class file and 1 ActionScript class file under classes folder with this following packages.
    i. com\codeofdoom\BlazeDsService
    ii. com\codeofdoom\StockQuote
    iii.com\codeofdoom\dto\StockQuote.as
    3.I put the mxml file under blazeds\bin-debug folder.

  8. January 10th, 2011 at 06:47 | #8

    One more time, you rock

  9. Puneet
    March 16th, 2011 at 17:04 | #9

    Hi ,

    I have a similar requirement as per to your article above.

    The only change is , I have to acccess an ArrayList from the HTTPRequest object and dislpay a graph.

    please suggest how to do it

  10. Jayashree
    June 22nd, 2011 at 22:33 | #10

    Good Info. Required for future reference purpose

  11. sureshkumar
    September 22nd, 2011 at 04:09 | #11

    Nice post…i learned basic concept from here.
    Thanks..

  12. Ravi
    May 8th, 2012 at 00:12 | #12

    WELL WRITTEN, THANKS A LOT….

  13. elyeah
    October 7th, 2012 at 22:32 | #13

    nice post….I am new with flex. and i got errors on implementing the .as
    duplicate function definition.

  14. Divakar Ingilala
    October 10th, 2012 at 00:51 | #14

    Nice post dude. I am new to flex this post is very understandable. thanks…

  1. No trackbacks yet.