Building Flex application for BlazeDS Remoting destinations using Flash Builder 4

Updated for Flash Builder 4 release version :)

Data Centric Development (DCD) in Flash Builder 4 allows developers to build Flex front end for Remoting destinations with just couple of clicks. Continue reading to see how Flash Builder is increasing J2EE developer productivity.

Set up BlazeDS

Download BlazeDS binary distribution from this URL Download (4MB) and follow instructions at this URL to setup BlazeDS http://sujitreddyg.wordpress.com/2009/04/07/setting-up-blazeds/

Once BlazeDS is setup you need to expose the Java class as Remoting destination, visit this URL to know how to expose a Java class as Remoting destination http://sujitreddyg.wordpress.com/2008/01/14/invoking-java-methods-from-adobe-flex/

Once your Java class is exposed as Remoting destination using BlazeDS, follow steps below to build Flex application using Flash Builder 4.

In this sample we will expose SimpleCustomerService.Java as Remoting destination. SimpleCustomerService communicates with database and returns SimpleCustomer objects.

Setting up BlazeDS RDSDispatchServlet

After setting up BlazeDS, you have to enable RDSDisptachServlet, which is used by Flash Builder 4 to get destination details. This is disabled by default. It’s very simple all you have to do is to un-comment/add the Servlet mapping in the web.xml.

Copy the Servlet URL mapping and declaration for the RDSDispatchServlet from the web.xml in the blazeds.war file and add to your web application web.xml file. If you copy the Servlet mapping from web.xml in blazeds.war file, don’t forget to change the useAppserverSecuirty param value to false as highlighted below. Alternatively copy the Servlet mapping from below

<servlet>
<servlet-name>RDSDispatchServlet</servlet-name>
<display-name>RDSDispatchServlet</display-name>
<servlet-class>flex.rds.server.servlet.FrontEndServlet</servlet-class>
<init-param>
<param-name>useAppserverSecurity</param-name>
<param-value>false</param-value>
</init-param>
<load-on-startup>10</load-on-startup>
</servlet>
<servlet-mapping id=”RDS_DISPATCH_MAPPING”>
<servlet-name>RDSDispatchServlet</servlet-name>
<url-pattern>/CFIDE/main/ide.cfm</url-pattern>
</servlet-mapping>

Install Flash Builder 4

Download and install Flash Builder 4 from here http://www.adobe.com/products/flashbuilder/

Creating new Flex project with BlazeDS server configurations

Create new Flex project

Create new Flex project from the File menu as shown in the image above.

Enter project details

In this screen:

  1. Enter project name
  2. set “Web (runs in Adobe Flash Player)” as the application type
  3. Use default Flex SDK (Flex 4.0)
  4. Set the application server type to J2EE
  5. Select BlazeDS
  6. Click on Next to continue

Configure J2EE server settings

In this screen:

  1. Set the Root folder to the root folder of your web application with BlazeDS configured. Its C:\Program Files\Apache Software Foundation\Tomcat 6.0\webapps\demo in this sample
  2. Set the Root URL to root URL of your BlazeDS enabled web application
  3. Set the Context root to context root of your BlazeDS enabled web application
  4. Leave the output folder to default value
  5. Click on validate configuration button
  6. Click finish to continue

Using DCD feature to connect to consume Remoting Service

DCD or Data-Centric Development is one of the advancements to the Flash Builder 4. Let’s see how this is making developers productive. In this sample we will see how to create a Flex application which consumes BlazeDS Remoting service. Same steps can be followed for LCDS Remoting services also.

Creating Service using DCD


  1. Select the Data/Services window shown in the image above. If this is not visible, select it from Window -> Data/Services
  2. Click on “Connect to Data/Service” (Highlighted in the image above) in the Data/Services window
  3. Window as shown in the image below will be launched

Select BlazeDS and click on Next. Flash Builder will display a window asking for RDS credentials. Since we turned off security for our RDSServlet by setting the “useAppserverSecurity” parameter to “false” in the web.xml, select “No password required” and click on OK to continue.

Selecting Remoting destination

You can see that Flash Builder listed all destinations exposed in the screen below.

In this screen we are selecting the destination the newly created service should use. All destinations available will be displayed. Select a destination (SimpleCustomerServiceDestination in this sample) and click on Finish to continue.

Code for invoking the Remoting service will be generated, you can see the service and its operations (methods exposed by the Java class) being displayed in the “Data/Services” window and in the package explorer.

Flash Builder 4 introspects return types for the Java class methods and creates AS3 classes for any custom Java classes.

Binding data/service to UI controls

Switch design view and drag and drop a DataGrid component as shown in the image below.

In this screen:

  1. Switch to design view
  2. Change the Application layout to “vertical” using the properties panel
  3. Drag and drop a “DataGrid” from the “components” panel on to the design area
  4. Set the width and height properties of the “DataGrid” to 100%

Select the DataGrid. Right click on the DataGrid and select “Bind to Data …” as shown in the image below

A window as shown in the image below will be launched.

In this screen:

  1. We select a “New service call” because there are no existing services in the current application.
  2. Select the “SimpleCustomerServiceDestination”
  3. Select “getAllCustomers():SimpleCustomer[]” from the operations list
  4. Selct “SimpleCustomer[]” as Data provider
  5. Click OK

You can see the DataGrid with columns for added for properties of the SimpleCustomer class in the design view as shown in the image below.

Configuring DataGrid columns

Select the DataGrid. Right click on the DataGrid and select “Configure Columns …” as shown in the image below.

A window with options to configure the columns for the DataGrid will be launched as shown in the image below.

In this screen:

  1. Arrange columns using the “up” and “down” button
  2. Click on OK
  3. Save and run the application

You can see application with data retrieved from the server and displayed in the DataGrid as shown in the image below.

More articles on how to use Flash Builder 4 – http://sujitreddyg.wordpress.com/flash-builder-4/

That’s it we have a Flex front end build for an existing Java class in just few minutes. Flash Builder 4 rocks :)

About these ads

54 Responses to Building Flex application for BlazeDS Remoting destinations using Flash Builder 4

  1. Vivian says:

    Good example. But I have a question suppose I am developing this same app in AIR what happens? The Blazeds setup form that we fill out at the beginning requires a root folder. AIR app can be running for a remote machine, how do we define the root folder for AIR app?

  2. MrVx23 says:

    I’m using BlazeDS to call EJB3 beans on the server – there is a custom factory set up in remoting config for that. It seems that FB4 currently cannot handle such a configuration, because it says the destination is not available when I try binding a Flex service to a destination in the wizard. You briefly mention Java beans in your post – do you know of any way to make calling EJBs work in the new wizard?

  3. Thiagarajan says:

    Hi

    I get this message on top of the services wizard

    Unable to authenticate on RDS server using current security information.

    How do I get past this
    I copied the RDS server jar to flex lib of the app and fixed the RDDispatchservlet info in web.xml also.

    Thanks
    Thiagu

  4. Hi Vivian,

    The root folder should be pointing to the server which your AIR application will send request to. Please check the article at the URL below for details.

    http://sujitreddyg.wordpress.com/2008/07/03/creating-blazeds-channels-at-runtime/

    Make sure you read the comments also :)

    Hope this helps.

  5. Hi MrVx23,

    I will check this and get back to you :)

  6. Hi Thiagarajan,

    Please set useAppserverSecurity param of the RDSDispatchServlet to false. I updated my post to reflect that. Thank you.

  7. Lurc says:

    All works. As well as always, it is needed a bit to work a head.

  8. Bill says:

    The BlazeDS download links no longer work. I assume you should download whatever is the BlazeDs 4 beta 1 build from http://opensource.adobe.com/wiki/display/blazeds/download+blazeds+trunk

  9. Hi Bill,

    Thanks for pointing this out, updated the post with correct URL :)

  10. Phil says:

    Do you know of a way to use a WTP-enabled project without it breaking all of the new data-centric development features? If you create such a project, FB 4 beta 1 gets confused about adding data sources. Without such a project, there’s no apparent way to have the server-side Java code and the client-side Flex code in the same project.

  11. Suresh says:

    I got this error while connecting to the data service after giving the name for the same and choosing finish

    aSome error occurred while attempting to write to the file.
    Error while generating value object classes : java.lang.NullPointerException

  12. Suresh says:

    Its success now, i tried other one its successful, wonder ful thanks a lot Sujit all ur posts are excellent.

    How to write class files for new databases please help

  13. Hi Suresh,

    Where do you want to create this database ? on the server or local system using AIR ?

  14. Simon says:

    hey sujit,
    i’ve got a problem with dcd and blazeds.

    in the panel “data services” I only get the choice between HTTP and WebService.
    via the main menu “data->connect to BlazeDS” I get the wizard window which is empty. It shows neither the caption nor any content. Just the cancel and finish buttons which both don’t work. The only chance to go back is the “x”.

    What I’m I doing wrong?
    I played around with the lcds3 and fiber (model driven approach) and everything was great.

    Facts:
    BlazeDS: latest Version (blazeds-turnkey-4.0.0.9845 and also blazeds-turnkey-4.0.0.9369)
    Flash Builder: latest version from pre-release (build 246332)
    Os: Mac
    Server type as J2EE/BlazeDS
    and RDS is setup and working

    Any ideas?
    Thanx in advance
    Simon

  15. Hi Simon,

    Thank you for bringing this to our notice. I don’t think you are doing anything wrong, I remember facing the same problem :) Did you try restarting Flash Builder ? Can you please share Flash Builder error logs. Thank you.

  16. Kris says:

    I’m getting this error from Tomcat 6.0.20 after following your instructions and using the correct version of BlazeDS:

    [BlazeDS]LCDS java introspector servlet initializing
    [BlazeDS]Unable to load RDS initClass (ClassNotFoundException): flex.rds.server.lcds.servlet.LCDSRDSServletInit

    I can’t figure out why/where this servlet is being referenced, but it would appear that the error is keeping RDS from starting up properly. Do you have any idea what could be causing this? I’ve search the bug DB with no luck and no mention of the problem anywhere else.

    Thanks!

  17. Perroud J-P says:

    Hi,
    With beta 2, I can no longer import a service with BlazeDS.
    Here is the error:
    ERROR: XML parse error: Error on line 1 of document: cvc-elt.1: Can not find the declaration of element ‘model’. Nested exception: Can not find the declaration of element ‘model’.
    Thank you for your help.
    JPP

  18. aaron says:

    ERROR: XML parse error: Error on line 1 of document: cvc-elt.1: Can not find the declaration of element ‘model’. Nested exception: Can not find the declaration of element ‘model’.

    Me also face a same problem. anyone can help please

  19. zoltane says:

    aaron, using BlazeDS v4.0.0.11030 nightly build will solve your problem.

    Zoltan

  20. Chris Alford says:

    Thanks for your article, very useful example. I have been struggling with BlazeDS , eclipse, FB beta 2 but am having a fair amount of success building an app drawing data from MS SQL and MySQL servers with RDO’s. But I still can’t solve the XML parse error cvc-elt etc. even though am using v4.0.0.11221. Doing a bit of research this is an error which has been re-occuring for a number of years. As a side line I had a great bug. It only happened on my 10.6 Mac, and when I transfered the files to my scabby old p.c. I saw the bug in action. It appeared that the MS SQL database driver was loading and then ? was loading any file with a similar name, e.g. the .mssql.jar hidden file which the Mac file system creates. The strangest part of this bug is that it disappeared once I totally corrupted my BlazeDS installation trying to fix the XML problem :)
    If anyone has a definite answer to the XML problem I would like to know.
    Regards Chris

  21. Martin Zach says:

    Hi,

    concerning the xml parse error: (last 4 posts)
    please take a look at:

    http://forums.adobe.com/thread/455187?tstart=0

    Thread on forums.adobe.com named “XML parse errors: web.xml, hibernate.cfg.xml, myClass.hbm.xml”

    There you can find a (temporarily) solution for this issue.

    Regards!
    Martin Zach

  22. Hi Simon,

    I used to face this problem with Flash Builder 4 beta 1, but not with Flash Builder 4 beta 2. Can you please confirm your Flash Builder 4 version.

    Thank you.

  23. Jan Janssens says:

    Hi,

    I’ve got a problem with flash builder 4 beta 2 and blazeds nightly build 4. It runs on a tomcat turnkey installation.

    And i can not connect to the RDS service with the flash builder. Allthough it is possible to see if my connection works, but it is impossible to use a wizard for getting the remote functions as prescribed in the remote-config.xml.

    I allways get the message RDS Server message: null as server response.

    Does anyone know what i’m doing wrong?

    Greetings,
    Jan

  24. Jan Janssens says:

    hi me again,

    lost some terms in the middle, it was the nightly build for blaze ds 4.0.0.13051 and i tried also the beta version.

    And i’m using flash builder 4 beta 2.

    Greetings,
    Jan

  25. José Otavio says:

    I´m also getting the error: RDS Server message: null, when trying to connect to the RDS service with the flash builder.

    What could it be?

    I´ve followed this post step by step, and can´t make it work.

  26. José Otavio says:

    I got my problem. Maybe it could help you Jan.

    - First, I was missing the step to expose the service in the remote-config.xml (I don’t know why, I thought it would be done by Flash Builder. Maybe because I was using PHP Services, before I start using Java Services, and this configuration wasn’t needed).
    - Second is that the server must be started, otherwise Flash Builder will not be able to “find” de Services.java

  27. eneldoserrata says:

    # MrVx23 Says:
    June 6, 2009 at 7:05 pm

    I’m using BlazeDS to call EJB3 beans on the server – there is a custom factory set up in remoting config for that. It seems that FB4 currently cannot handle such a configuration, because it says the destination is not available when I try binding a Flex service to a destination in the wizard. You briefly mention Java beans in your post – do you know of any way to make calling EJBs work in the new wizard?

  28. Ken says:

    Yes if you have XML Error get new BlazeDS nightly build and off you go.

  29. justin says:

    I was also getting the “RDS Server message: null” error when attempting to Connect to Data/Service in FlashBuilder 4 using BlazeDS 4.

    It turns out I’d added a trailing slash to the Context root under properties -> Flex Server. This was following the TestDrive example at http://www.adobe.com/devnet/flex/testdrive/articles/1_build_a_flex_app.html. So instead of testdrive, I had testdrive/.

  30. Felix Schöpf says:

    I encountered a problem connecting to the data/service (BlazeDS) in FlashBuilder 4 (Release Version).

    I created a flex/java combined flex project with WTP, edit the web.xml file and the remoting-service.xml and follow all the other instructions. I start the server with the web app and try to connect to data/services (BlazeDS) but it says error 404: Not Found.

    If I use the the RDS Configuration in the Flash Builder Preferences and I test the connection, everything is fine and it says that the connection is ok.

    So what can be the problem?

    Regards Felix

  31. Hi Felix,

    Can you please check if the URL in the project server settings are correct. When does this error appear?

  32. Craig says:

    Sujit,

    I’m getting the same -404 error as Felix. I’m using FB 4 and a nightly build of BlazeDs 4 (4.0.0.015700). My Flex project is a combined WTP project using Tomcat 6.x. The web.xml is configured fine and if I browse to the servlet I get the expexted -405 Get Request not permitted. In FB 4 Plugin (Eclipse) If I create the RDS connection and do a “Test Connection”, I get success. When I go to Data/Services view in FB perspective and select Connect to Data/Services –> BlazeDS (no password required selected and ensuring the URL to my webapp) correct I’m getting the -404 error and can go no further with it.

    Any ideas?
    Regards
    Craig

  33. VenkatReddy S says:

    Hi sujit
    i was the set the fcous to Textinput( that Textinput
    in LoginWindow application) ,but it was highlinght the
    TextInput,but cursor was not placed in textInput.

    plz send me code

  34. Gurvinder says:

    I am not getting any service as you mentioned “All destinations available will be displayed. Select a destination (SimpleCustomerServiceDestination in this sample) and click on Finish to continue.”
    Again I read the complete article to find how to add service. Can you please explain?
    Thanks

  35. Dario says:

    Well done!
    Tanx for tutorial!
    U r the man!

  36. Mehdi says:

    Hello,

    Amazing tutorial,thank you so much,i managed to use BlazeDs with Glassfish thanks to you,i was stuck since 3 days.
    Again,thank you,i am gonna definitely subscribe to your blog,you have a new fan in Tunisia.

  37. Moloy says:

    I have following error while trying to connect to Flex 4
    ” Invalid root. The WEB-INF/flex folder must contain either flex-config.xml or services-config.xml.”

    My root folder (where the BlazeDS app is sitting )
    “C:\UserData\data\demo”
    My root url(“http://localhost:9081/demo) >> I created a JSP/HTML page to test it and it is working as (http://localhost:9081/Demo/test.jsp)

    But I can’t get pass the “Invalid root” problme ,, What am I doing wrong?

    Thanks for help

  38. Nishanth AS says:

    HI,
    Can u suggest any tutorial to build a chat application with flex4 and blazeds4

  39. Lal says:

    Hi,
    I am trying BlazeDS 4 with Flash Builder 4 plugin on Eclipse 3.5.2 where I am running my project on Weblogic 10.3.3. I have configured BlazeDS to expose a remote Java object. When I try to connect to BlazeDS using the Data Service wizard, it throws error like the RDS servlet was not found… uncomment RDS servlet…. But I am able to access that object from one of the flex pages. I did also check the RDS servlet on browser http://localhost:7001/myweb/CFIDE/main/ide.cfm where it seems working.

    Thanks in help.

  40. Prdaeepkumar S. Gupta says:

    Need help for creating Flex project in Flash Builder using Flex sdk 3.5 and GraniteDS with JBOSS server

  41. Pradeep says:

    Hi,
    My requirement is to take snapshot in Flex application and paste that in MS-word using IE.
    Currently, I am doing so through Flex and Javascript but that requires a “Paste Special” option in MS-word to perform copy-paste.
    My requirement is that it should work as a normal copy-paste from Flex to MS-word.

  42. preethi says:

    Hi Sujit,

    I have a source code folder which wass already done by some one and i imported it into the flash builder 4, but when i run it it gives me an error as
    Description Resource Path Location Type
    unable to open ‘C:/mcw_software/Projects/xxx_AIR/xxx_AIR/WEB-INF/flex/remoting-config.xml’ xxx_AIR Unknown Flex Problem

    can u plz solve me problem

  43. Hi Preethi,

    Looks like the remoting-config.xml file is not in right place. Go to additional compiler settings in Flash Builder, you can find services-config.xml file location. In services-config.xml you will find path to remoting-config.xml will be included. Please make sure the remoting-config.xml is in right place.

    Hope this helps.

  44. preethi says:

    Hi sujit

    Thanks for the reply. i have some more doubts like error of
    unable to open ‘\VaraFramework\bin\VaraFramework.swc’ docsource Unknown Flex Problem

    can u tell me how to resolve this

  45. Hi Lal,

    Can you please check if the project server settings are properly set.

  46. Hi Preethi,

    Can you please check if the swc is in place.

    Hope this helps.

  47. I am very thankful to provide knowledge for configuration of Flex with java using BlazeDS

    I am trying BlazeDS 4 with Flash Builder 4 plugin on Eclipse 3.5 helio but unable to do it.

  48. I am very thankful to provide knowledge for configuration of Flex with java using BlazeDS

    I am trying BlazeDS 4 with Flash Builder 4 plugin on Eclipse 3.5 helio but unable to do it.

    Please provide the help. I am using window 7 64bit

  49. Hemant says:

    Hi Sujit,
    I am trying to Setting up BlazeDS RDSDispatchServlet with Glassfish, but no success. Successfully enabled it for tomcat but not for Glassfish. Getting “Error executing RDS commmand Status 404″ error. I have added required jar files into the app lib & modified web.xml.
    Cna you please tell me if there anything else that I am missing?

    Thanks
    Hemant

  50. anupam says:

    Hi Sujit

    Thank you very much for your valuable information. I have been facing some problems while setting the RDS server. My parameters are:
    Windows->Preferences->Adobe->RDS Configuration:
    Description: RDS
    Host Name: 127.0.0.1
    Port Number: 8400

    I am setting this environment in my local system. Each time I press Test Connection I get,”Unable to contact the RDS Server “RDS”.

    What could be the reason ?
    And how to start and stop this RDS Server?

    Please help.

    Anupam Gogoi
    Software Developer
    Brasil.

  51. Mohannad says:

    I tried this tutorial on a spring application, but when i am trying to connect to BlazeDS Flash builder become not responding for a minute then an empty error message appears.

    Please if any one knows why, please tell me

    Best

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 111 other followers

%d bloggers like this: