Integrating Spring (MVC) and BlazeDS (flex)

Disclaimer:

I am not an expert in either Spring MVC or Flex and this article is not about fundamentals of Flex/BlazeDS. Its just how to get it working. Quickly.

Prologue:

I was playing around with Flex for the past couple of days. Being a Java developer, I was naturally inclined towards trying out BlazeDS so that I can use Flex as a front-end to my Java backend. The thing that I suffered from most was a huge information deluge. I was flooded by loads of blogs, articles and tutorials which made my life miserable. Finally, I saw a saviour in: Bare Bones BlazeDS Object Remoting, which explains how to create a BlazeDS and Java integration. Of course this does not include spring integration. Then I downloaded Spring BlazeDS, and went through the samples. Then I kind of combined these two and figured out how to make it work. The challenge here is that I have existing screens which are pure Spring MVC stuff. I am trying to embed flex in some of them, and have BlazeDS integration with my existing spring beans. Read on...

First things first: directory structure

My project directory looks like:

Details:

1. src/main/java contains all my java files
2. src/main/resources has all config files like hibernate.cfg.xml, property files, etc.
3. src/main/webapp has the WEB-INF folder and the jsps
4. src/main/webapp/flash has all the compiled .swf files to be embedded in the jsps
5. src/main/flex has all the .mxml and action script files

Config files required for BlazeDS

You would need these three config files under the WEB-INF/flex directory:

services-config.xml

This is the most important file. This defines the various channels that would be used for client/server communication by the BlazeDS

	
		
		
			
		
	
	
		
			
			
				false
			
		
	
	
		
		
			
				[BlazeDS] 
				false
				false
				true
				false
			
			
				Endpoint.*
				Service.*
				Configuration
			
		
	

remoting-config.xml

This defines the remoting adapter used by the flex client.

BlazeDS/Spring integration

To integrate Spring with BalzeDS, you have to touch upon these existing files:

web.xml

1. Adding the flex listener

Add the flex.messaging.HttpFlexSession listener.

2. URL mapping

Note that in the services-config.xml, the url of the default channel my-amf is http://{server.name}:{server.port}/{context.root}/spring/messagebroker/amf. You have to pass any url with this pattern to the Spring front end handler servlet, the org.springframework.web.servlet.DispatcherServlet. I assume that you already have a similar servlet defined for your Spring MVC. You should use the same servlet (so that you can re-use the same beans in flex) to map these urls. I am assuming the name of the existing DispatcherServlet is dispatcher.
This is how the modified web.xml looks like:

...
    
    
        flex.messaging.HttpFlexSession
    
    
        dispatcher
        /spring/messagebroker/*
    
...

dispatcher-servlet.xml

This xml already has the existing Spring MVC beans. This has to be modified to expose existing beans to the BlazeDS remoting as services. The xml header has to be modified as follows:

...

Then, the body has to be modified by adding:

...
    
    
    
    
    

    
        
            
                /messagebroker/*=_messageBroker
            
        
        
    
...

Finally, this is how you expose a bean as a service for remoting:

...
    
    
    
...

This is how the AccountGroupManager looks like:

public class AccountGroupManager {
    public AccountGroupManager() {
        System.out
                .println("*****************AccountGroupManager.AccountGroupManager()");
    }
    public String save(String name, String desc) {
// dummy code, returning static string
        return "40";
    }
}

Coding the mxml

I am using eclipse to code the NewAccountGroup.mxml. This is how it looks like:

Compiling mxmls to swf

The one thing you have to keep in mind is that, you have to compile the mxmls along with the services-config.xml. Note that you have something like url="http://{server.name}:{server.port}/{context.root}/spring/messagebroker/amf" in there. While the server.name and server.port will be taken by default by the client, you have to specify the context.root during the compile time, as an argument. This is the context of your webapp. I am using the mxmlc that comes with the Flex SDK from the command prompt (you can add it to the PATH). First you cd to the src/main/flex directory. Here you go:
mxmlc -services ../webapp/WEB-INF/flex/services-config.xml -strict=true -debug=true -context-root=/ -show-actionscript-warnings=true -output ../webapp/flash/NewAccountGroup.swf NewAccountGroup.mxml
Note how you specify the services-config.xml.
So far so good. Now we will have to embed the generated flash into our jsp. This how it is done:

    

...

 
Finally, just a word for Maven users, these are the arifacts you have to use:

...
    
...
        
        
        
            com.adobe.blazeds
            blazeds-common
            ${blazeds.version}
        
        
            com.adobe.blazeds
            blazeds-core
            ${blazeds.version}
        
        
            com.adobe.blazeds
            blazeds-opt
            ${blazeds.version}
        
        
            com.adobe.blazeds
            blazeds-proxy
            ${blazeds.version}
        
        
            com.adobe.blazeds
            blazeds-remoting
            ${blazeds.version}
        
        
        
            org.springframework.flex
            spring-flex
            ${spring.flex.version}
        
        
			xalan
			xalan
			${xalan.version}
        
        
            edu.oswego.util
            concurrent
            ${concurrent.version}
        
        
...
    
...
    
        3.2.0.3978
        1.0.0.RELEASE
        2.7.0
        1.3.3
    
...

For others, you can always expand the blazeds.war and put all the jars inside the WEB-INF/lib.
The only pain point for this approach is that every time you change your context root, you have to recompile all your flex against the services-config.xml along with a new context.root argument.
This is how the end screen looks like (in the browser):

 

Sources

https://github.com/paawak/legacy-apps-from-desktop/tree/master/products/ims/ims-web/trunk

---