Build Rich Internet Applications that Run Outside the Browser

Adobe AIR on Ulitzer

Subscribe to Adobe AIR on Ulitzer: eMailAlertsEmail Alerts newslettersWeekly Newsletters
Get Adobe AIR on Ulitzer: homepageHomepage mobileMobile rssRSS facebookFacebook twitterTwitter linkedinLinkedIn


Adobe AIR Authors: Yeshim Deniz, Yakov Fain, David Weinberger, Maureen O'Gara, Tad Anderson

Related Topics: Java EE Journal, Adobe AIR on Ulitzer, XML Magazine, SOA & WOA Magazine

J2EE Journal: Article

Data Services Made Easy for Adobe Flex Applications

An approach based on XML and e4x

The framework layer consists of two parts: the generated AS server object counterparts and the conversion to AS from XML and AS back to the XML layer. The server counterpart AS layer is generated from the server-side interface schema to populate the AS classes. The conversion to the AS layer contains the logic to convert the incoming XML response to AS class objects transparently. The conversion layer also knows to convert the AS objects passed in as parameters to call a remote service using HTTP/Web Service calls. So the framework layer becomes an inherent part of the Flex application itself providing the infrastructure to call back-end services.

The generation of AS classes from schema/WSDL is done using the wsdl2as tool, a standalone Java application. This application generates the AS sources from the schema definition compatible with the framework's conversion layer. To put the new framework to use, the generated sources may be included in the Flex UI project as an add-on source path and the conversion layer as a library.

Now let's take a simple use case and see how the new framework works. For simplicity's sake let's consider a server hosting a Web Service or a Web application providing the HTTP access and XML response (REST API). In any of the cases above to fetch data to the Flex application running our framework, an XML Schema representation of the server-side objects is required. For the Web Service it may be found in the WSDL file describing the Web Service but for REST-type Web application it might be present in the application or generated from the underlying database schema. Once the XML Schema is found, the AS counterparts of the server-side object can be generated using a tool called the WSDL2AS converter. It generates the AS files that the framework can use to convert XML input to AS and back.

For brevity the samples discussed here will be kept simple and show the power of the underlying framework to build Flex applications for deployed server implementations.

A Simple HTTP and REST API-based Example
First let's see how to build a Flex UI application for a server implementing the REST API, i.e., a simple HTTP request and XML response, which has gotten popular recently. The method of building a REST-style application is based on the schema defining the back-end server objects. AS classes are generated from the schema representation with the wsdl2as tool provided with the framework. To explain REST-style invocation let's consider a fairly complicated production server, an Amazon ECS Web Service, to show how the framework handles the same with great ease.

To start building a REST-type solution for the Amazon ECS know that:

• The WSDL describing the Amazon ECS services and all complex types may be found at http://webservices.amazon.com/AWSECommerceService/AWSECommerceService.wsdl .The AS classes can be generated on this WSDL by running the wsdl2as tool.
• The generated source from the wsdl2as tool can be found in the attached amazon.ecs.jar file.
• The conversion layer for the framework can be found in the Flex-xmlrpc.swc file.

Now to build a simple application using the framework and Amazon ECS, let's submit a simple request to the Amazon Server and try to generate the object map from the classes in the amazon-ecs.jar on a successful server response. The HTTP request to send to the Amazon server is:

http://ecs.amazonaws.com/onca/xml?
Service=AWSECommerceService&
Operation=ItemSearch&
AWSAccessKeyId=[Your Access Key ID]&
AssociateTag=[ID]&
SearchIndex=Apparel&
Keywords=Shirt

This request will search Amazon for "Apparel" on the keyword "Shirt." On successful invocation the response will return an XML document with <ItemSearchResponse> as the root.

From the generated classes, the class that corresponds to the <ItemSearchResponse> complex type is "com.amazon.webservices.AWSECommerceService._2007_06_13.ItemSearchResponse" class. So the XML response can be parsed by the conversion layer to instantiate and populate an object of the ItemSearchResponse class.

The code to convert the response to ItemSearchResponse is:

public function onSuccess(event:ResultEvent):void{
var xml:XML = event.result as XML;
    xml = XMLUtil.removeNamespace(xml);
    itemSearchResponse = new ItemSearchResponse().fromXML(xml) as
       ItemSearchResponse
    ...
}

For brevity's sake the UI for this Flex application is kept simple. The mxml file for the application can be found in Listing 1.

A Web Service and SOAP-based Example
Now let's put the same example to work with SOAP and Web Services. The steps to generate the AS classes from the wsdl file found at http://webservices.amazon.com/AWSECommerceService/AWSECommerceService.wsdl are the same. So the same amazon.ecs.jar files for the AS generated source and Flex-xmlrpc.swc for the framework will be used in this case too.

To call the operation "ItemSearch," the generated com.amazon.webservices.AWSECommerceService._2007_06_13.The ItemSearch class can be used. The ItemSearch class can be found in Listing 2.

To execute the "ItemSearch" operation, function call(…) shown below can be used with AS objects passed in as parameters:

public function call( MarketplaceDomain:String,
    AWSAccessKeyId:String,
    SubscriptionId:String,
    AssociateTag:String,
    XMLEscaping:String,
    Validate:String,
      Shared:com.amazon.webservices.AWSECommerceService._2007_06_13.ItemSearchRequest,
    Request:ArrayCollection
    /**com.amazon.webservices.AWSECommerceService._2007_06_13.ItemSearchRequest**/,
    OperationRequest:
    com.amazon.webservices.AWSECommerceService._2007_06_13.OperationRequest,
      Items:ArrayCollection
      /**com.amazon.webservices.AWSECommerceService._2007_06_13.Items**/):void{
   send([MarketplaceDomain,AWSAccessKeyId,
SubscriptionId,AssociateTag,
XMLEscaping,Validate,
Shared,Request,OperationRequest,Items]);
}


More Stories By Indroniel Deb Roy

Indroniel Deb Roy works as an UI Architect for BlueCoat Systems.He has more than 10 years of development experience in the fields of J2EE and Web Application development. In his past he worked in developing web applications for Oracle, Novell, Packeteer, Knova etc. He has a passion for innovation and works with various Web2.0 & J2EE technologies and recently started on Smart Phone & IPhone Development.

More Stories By Alex Nhu

Alex Nhu works as a manager, UI Development at Packeteer Inc. He has more than 11 years of work experience designing and architecting complex server-side J2EE and XML applications. He loves developing Web applications with Flex now after getting a taste of developing UI using other RIA platforms.

Comments (13) View Comments

Share your thoughts on this story.

Add your comment
You must be signed in to add a comment. Sign-in | Register

In accordance with our Comment Policy, we encourage comments that are on topic, relevant and to-the-point. We will remove comments that include profanity, personal attacks, racial slurs, threats of violence, or other inappropriate material that violates our Terms and Conditions, and will block users who make repeated violations. We ask all readers to expect diversity of opinion and to treat one another with dignity and respect.


Most Recent Comments
pixelwiz 10/14/09 12:05:00 PM EDT

I've been a ColdFusion developer for about 5 years, and can do a lot of cool stuff with jQuery and alike, but time has come for me to have to write my first Flex app, and I'm hoping you might have a few suggestions.

I'm doing research on if it's even possible for me to do what I need. I'm building an app to manage scores for golf tournaments, and some things like the leader boards, really need to be refreshing in real time. So as new scores come in, they should immediately be reflected on all leader boards, ideally with some animation or highlight that indicates a score just changed. Now the closest thing I've seen to what I need to do were all those CNN, Fox, CNBC apps during the last presidential elections, where as results were coming in the data was automatically refreshing. I don't even know how that works conceptually, is it the server somehow pushing the data to the Flex clients? Cause I don't want every Flex client to have to keep hitting the server every couple of seconds querying for changes like a web page would have to.

Any help, suggestions, examples are highly appreciated.
Thanks,
-Roman

sailbv 12/03/08 10:56:23 PM EST

Where are listing 3 and listing 4?

Humberto A. Sanchez II 12/10/07 07:52:20 AM EST

Are you having any success either releasing the reference implementation or starting an open source project around this?

Indroniel Deb Roy 11/04/07 01:27:38 PM EST

The wsdl2as framework mentioned here is not the wsdl2as open source one. It's a fresh implementation!

Sebastien Arbogast 10/29/07 05:49:05 PM EDT

Your framework is exactly what I'm looking for. I thought similar functionality was already embedded into Flex but to my great disappointment, it's not. So I'd really love to see what you've come up with. And if I can help, it's with pleasure.
Is open source flash's wsdl2as the framework you're talking about?

Indroniel Deb Roy 09/21/07 12:33:00 PM EDT

This paper or the sample implementation (not currently available for public use) do not use wsdl2as tool(found in http://osflash.org/wsdl2as) to generate as3 code.
So, why wsdl2as tool fails is not pertinent to this paper as such. Please, visit any discussion forum provided by the project to discuss about specific issues in the wsdl2as tool.

The sample implementation in this paper do generate as3 code, but is implemented fresh from scratch. This paper is trying to just explain the architectural details of the approach ...

Ryan K 09/21/07 10:02:01 AM EDT

wsdl2as simply does not work. Worse, it doesn't tell you what the problem is:

Exception in thread "main" java.lang.IllegalArgumentException: local part cannot be "null" when creating a QName
at javax.xml.namespace.QName.(Unknown Source)
at javax.xml.namespace.QName.(Unknown Source)
at uk.co.badgersinfoil.asxsd.TypeNameGenerator.typeName(TypeNameGenerator.java:29)
at uk.co.badgersinfoil.asxsd.TypeBuilder.representationClassForComplexType(TypeBuilder.java:81)
at uk.co.badgersinfoil.asxsd.TypeBuilder.typeNameFor(TypeBuilder.java:46)
at uk.co.badgersinfoil.asxsd.MarshalingCodeGenStrategy.addConversionFromParameter(MarshalingCodeGenStrategy.java:78)
at uk.co.badgersinfoil.asxsd.MarshalUnmarshalBuilder.buildMethodBody(MarshalUnmarshalBuilder.java:89)
at uk.co.badgersinfoil.asxsd.MarshalUnmarshalBuilder.buildMethodBody(MarshalUnmarshalBuilder.java:111)
at uk.co.badgersinfoil.asxsd.MarshalUnmarshalBuilder.createMethodForElement(MarshalUnmarshalBuilder.java:81)
at uk.co.badgersinfoil.asxsd.MarshalUnmarshalBuilder.conversionMethodFor(MarshalUnmarshalBuilder.java:335)
at uk.co.badgersinfoil.wsdl2as.ASXSDTypeMappingStrategy.convertExprToXML(ASXSDTypeMappingStrategy.java:44)
at uk.co.badgersinfoil.wsdl2as.ActionScript3Builder.buildOperationParameterList(ActionScript3Builder.java:371)
at uk.co.badgersinfoil.wsdl2as.ActionScript3Builder.buildBindingOperationMethod(ActionScript3Builder.java:280)
at uk.co.badgersinfoil.wsdl2as.ActionScript3Builder.buildBinding(ActionScript3Builder.java:267)
at uk.co.badgersinfoil.wsdl2as.ActionScript3Builder.buildAllBindings(ActionScript3Builder.java:243)
at uk.co.badgersinfoil.wsdl2as.ActionScript3Builder.build(ActionScript3Builder.java:78)
at uk.co.badgersinfoil.wsdl2as.Main.process(Main.java:88)
at uk.co.badgersinfoil.wsdl2as.Main.main(Main.java:59)

Indroniel Deb Roy 09/12/07 12:51:28 PM EDT

The generated code might need to change if there are major changes in the action script language or some API change in flex web-services support. In Moxie(flex 3) release there is no major change in the AS language and flex Web Service API, so the generated code should just work fine.

Tom Van den Eynde 09/12/07 05:45:20 AM EDT

If I'm correct there will be similar support for this in Flex 3. If so: can the generated code easily be replaced by what is available through Flex 3 later on?

Thiru Rajesh 09/11/07 11:49:09 AM EDT

This is indeed a nice article on overall architecture of flex based applications based on complex server side data requirements. It will definitely serve as an alternative to FDS for programming flex ui for public web services.

Steve 09/05/07 05:15:52 PM EDT

This is one of those ideas that entice us designer crossovers with visions of easily discoverable, accessable, post-processable server-side stuff. And if we know enough T-SQL we can really take better at an architectural level.

Can't help but wonder at the lack of followup/comments by the community.

On the subject of compression; what's it take to bring XML into line AMF much less AMF3 (& setting aside scalability issues) for a 'text-heavy' object.

What would the reverse look like? if one were defining the server-side objects from the native Flex? Couldn't we literally feed mxml components in a digestible way?

Dave 08/24/07 09:56:39 AM EDT

Could you provide a link to a much larger version of your 1st diagram?
http://res.sys-con.com/story/aug07/418939/fig1.jpg

FDJ News Desk 08/21/07 12:59:19 PM EDT

Flex has gotten popular lately because of its rich GUI capabilities. It also comes in handy with HTTPService and Web Service components connecting to back-end servers to fetch and update data. But using this mechanism to talk to the back-end server requires formulating a unique service object from the Flex side, making a request, and getting back data from the back-end either in XML or plain text format. The response data then has to be parsed and fed to the Flex objects to update the UI. For small to medium-size Flex projects it's a viable solution, but for enterprise projects with thousands of external service calls it will get quite repetitive and could result in a lot of unmanageable, buggy code.