Flex 4 & Spring 3 Integration
Integrating Flex And Spring
Adobe Flex has strong ties to Java, which include an Eclipse-based IDE and BlazeDS, its open source server-based Java remoting and web messaging technology.
By default BlazeDS creates instances of server-side Java objects and uses them to fulfill remote object requests. This approach doesn’t work with Spring, as the framework is built around injecting the service beans through the Spring container. The Spring integration with BlazeDS allows you to configure Spring beans as BlazeDS destinations for use as remote objects in Flex.
You will initially need:
1) An Eclipse 3.5 Distribution. Either You may choose either the standard Eclipse 3.5 (Galileo) for Java EE Developers (On Mac use the Eclipse Carbon version): http://www.eclipse.org/downloads/
For enhanced Spring support you can use the SpringSource Tool Suite:
http://www.springsource.com/products/springsource-tool-suite-download/
2) Flash Builder 4 (60 day T rial) installed as a plug-in for the Java EE Eclipse
http://www.adobe.com/go/try_flashbuilder
3) Tomcat 6: http://tomcat.apache.org/
4) BlazeDS 4 (Binary Distribution):
http://opensource.adobe.com/wiki/display/blazeds/BlazeDS/
5) Spring Framework 3.0.2 (vanilla r elease):
http://www.springsource.org/download
6) Spring BlazeDS Integration 1.0.3 (vanilla r elease):
http://www.springsource.org/spring-flex
7) AOP Alliance 1.0:
http://sourceforge.net/projects/aopalliance/files/
8) backport-util-concurrent 3.1 for the Java version you’r e using:
http://sourceforge.net/projects/backport-jsr166/files/backport-jsr166/
9) cglib 2.2 http://sourceforge.net/projects/cglib/files/
10) asm 3.2 http://forge.ow2.org/projects/asm/
I think now we are ready with initial elements lets start with server setup
First install your chosen Eclipse and then install Flash Builder 4 as a plug-in to the Eclipse distribution you just installed. Also extract the ZIP files for the other dependencies specified above. When you’ve completed these steps, run Eclipse. In Eclipse create a server that will run the application:
1. Choose File > New > Other
2. Select Server > Server
3. Click Next
4. Select Apache > Tomcat v6.0 Server
5. Click Next
6. Specify the location where Tomcat is installed and select the JRE(version 5 or higher) to use
7. Click Finish
Set up the server-side Java web project in Eclipse by creating a web application from the blazeds.war file
(found inside the BlazeDS zip file).
In Eclipse, import the blazeds.war file to create the project:
1. Choose File > Import
2. Select the WAR file option. Specify the location of the blazeds.war file.
For the name of the web project, type samplepring
3. Click Finish
First remove the xalan.jar file from the WebContent/WEB-INF/lib folder. Next, go into the project properties. One way to get there is by right-clicking on the project and selecting Properties. In the project properties, select Java Build Path and then click the Source tab. Set the Default Output Folder samplepring/WebContent/WEB-INF/classes
This causes all Java classes that are created in the project to be deployed in the web application.
In the WebContent/WEB-INF/flex folder update the services-config.xml file with the following contents:
<?xml version=”1.0” encoding=”UTF-8”?>
<services-config>
<channels>
<channel-definition id=”my-amf” class=”mx.messaging.channels.AMFChannel”>
<endpoint url=”http://{server.name}:{server.port}/{context.root}/messagebroker/amf”
class=”flex.messaging.endpoints.AMFEndpoint”/>
</channel-definition>
<channel-definition id="my-streaming-amf" class="mx.messaging.channels.StreamingAMFChannel">
<endpoint url="http://{server.name}:{server.port}/{context.root}/messagebroker/streamingamf"
class=”flex.messaging.endpoints.StreamingAMFEndpoint”/>
</channel-definition>
<channel-definition id=”my-polling-amf” class=”mx.messaging.channels.AMFChannel”>
<endpoint url="http://{server.name}:{server.port}/{context.root}/messagebroker/amfpolling"
class=”flex.messaging.endpoints.AMFEndpoint”/>
</channel-definition>
</channels>
</services-config>
Now select the Servers tab in Eclipse. If the tab is not visible you can make it visible by choosing Windows > Show View > Servers. Right-click the Tomcat Server and select Add and Remove. To add the samplepring web application to the server, select it in the Available list and then click Add. Finally, click Finish.Next, you need to add the required dependencies to the samplepring web application. Copy all of the Spring Framework libraries / JAR files (located in the dist folder) to the WebContent/WEB-INF/lib folder. Also copy the Spring BlazeDS Integration library (located in the dist folder) to the lib folder. Do the same for aopalliance.jar, backport-util-concurrent.jar, cglib-2.2.jar, asm-3.2.jar.
Simple Flex Remoting
<web-app xmlns=”http://java.sun.com/xml/ns/javaee” xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance” xmlns:web=”http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd” xsi:schemaLocation=”http://java.sun.com/xml/ns/javaeehttp://java.sun.com/xml/ns/javaee/web-app_2_5.xsd” version=”2.5”> <listener> <listener-class> org.springframework.web.context.ContextLoaderListener </listener-class> </listener> <listener> <listener-class>flex.messaging.HttpFlexSession</listener-class> </listener> <servlet> <servlet-name>samplespring</servlet-name> <servlet-class> org.springframework.web.servlet.DispatcherServlet </servlet-class> <init-param> <param-name>contextConfigLocation</param-name> <param-value></param-value> </init-param> <load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>samplespring</servlet-name> <url-pattern>/messagebroker/*</url-pattern> </servlet-mapping> </web-app>
Now configure Spring by creating an applicationContext.xml file in the WebContent/WEB-INF folder with the following contents:
<?xml version=”1.0” encoding=”UTF-8”?> <beans xmlns=”http://www.springframework.org/schema/beans” xmlns:flex=”http://www.springframework.org/schema/flex” xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance” xmlns:context=”http://www.springframework.org/schema/context” xsi:schemaLocation=”http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.0.xsd http://www.springframework.org/schema/flex http://www.springframework.org/schema/flex/spring-flex-1.0.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.0.xsd”> <flex:message-broker> <flex:remoting-service default-channels=”my-amf”/> </flex:message-broker> <context:component-scan base-package=”flex” /> </beans>
package flex;
import org.springframework.flex.remoting.RemotingDestination;
import org.springframework.flex.remoting.RemotingInclude;
import org.springframework.stereotype.Service;
@Service
@RemotingDestination
public class HelloWorldService {
@RemotingInclude
public String sayHello(String name) {
return “howdy, “ + name;
}
}
Create the Flex Application
Click Finish to create the project. You should now see the template code for the application. Replace the code with the following:
<?xml version=”1.0” encoding=”utf-8”?>
<s:Application xmlns:fx=”http://ns.adobe.com/mxml/2009”
xmlns:s=”library://ns.adobe.com/flex/spark”
xmlns:mx=”library://ns.adobe.com/flex/mx”>
<fx:Declarations>
<s:RemoteObject id=”ro” destination=”helloWorldService”
endpoint=”http://localhost:8080/samplespring/messagebroker/amf”/>
</fx:Declarations>
<s:layout><s:VerticalLayout/></s:layout>
<s:TextInput id=”t”/>
<s:Button label=”sayHello” click=”ro.sayHello(t.text)”/>
<s:Label text=”{ro.sayHello.lastResult}”/>
</s:Application>
When you save the file it should automatically compile. When it is compiled it should automatically be deployed in your web application.You are now ready to start the server and test the application. Go to
the Servers View in Eclipse and start the Tomcat server. Watch the console and make sure that there are no startup errors.Now run the sayHello application (one way is to right-click the sayHello.mxml file, select Run As, and then select Web Application). Your browser should open the sayHello.html file that then downloads and runs the Flex application. Type your name in the TextInput box and click the sayHello button. This will initiate a Flex Remoting request to the Tomcat server calling the Spring DispatcherServlet, which then will
look up the service based on the destination helloWorldService. This destination is automatically mapped to the HelloWorldService Spring Bean. Then the sayHello method will be invoked on the bean, passing
in the String that was specified in the RemoteObject call on the client. The method returns a new String, which is then serialized into AMF, inserted into the HTTP Response body, and sent back to the client. On
the client side the Flex application will parse the AMF and then set the ro.sayHello.lastResult property to what was returned from the server.Data binding in the Label will note the property change and refresh its view of the data.
Happy Coding…..
