Flex Spring BlazeDS Integration (on public web server)

This won't be a post about how to integrate Flex and Spring. Actually I intended to be one, but several days ago James Ward posted this tutorial on how easy it is to do with Flash Builder 4 so I thought it won't be necessary.

Edit:  you can checkout the new post of how to upload files with Flex and Spring

What I will show is how to upload our project to a free Java and Tomcat host to test it, connect our Flex application to it and show this example here. I've been looking for such free hosting and the only thing I've found (if there are any others please comment) is eatj.com that provides a free trial limited up to 50 MBs of storage and every 6 hours the server is restarted, but for testing is fine.

I assume that you already created your Spring project based on the tutorial. I've added small changes for the current example, if you want the source of the example get it from here. Now right click on the project -> Export -> WAR file and select where to export it.
Now we log into our account in eatj.com and upload the war file, restart the server and this is it.

Now for the Flex part, although I haven't used the Data Wizards from Flash Builder (as I've had small problems) I did it the old fashioned way and the source is:

<?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/halo" minWidth="1024" minHeight="768"
         applicationComplete="remoteObject.addMessage(null, null, null)">
  <fx:Script>
    <![CDATA[
      import mx.controls.Alert;
    ]]>
  </fx:Script>
  <fx:Declarations>
    <s:RemoteObject id="remoteObject" destination="myService" fault="Alert.show(event.fault.message);">
      <s:channelSet>
        <s:ChannelSet>
          <s:AMFChannel uri="http://maverix77.s215.eatj.com/spring-flex-server/messagebroker/amf"/>
        </s:ChannelSet>
      </s:channelSet>
    </s:RemoteObject>
  </fx:Declarations>
  
  <mx:DataGrid x="0" dataProvider="{remoteObject.addMessage.lastResult}" width="402" y="0">
    <mx:columns>
      <mx:DataGridColumn dataField="sender"/>
      <mx:DataGridColumn dataField="text"/>
      <mx:DataGridColumn dataField="date"/>
    </mx:columns>
  </mx:DataGrid>
  <mx:Form x="10" y="160" width="252" height="142">
    <mx:FormHeading label="Leave new message" width="206"/>
    <mx:FormItem label="Your name">
      <s:TextInput id="nameInput"/>
    </mx:FormItem>
    <mx:FormItem label="Message text">
      <s:TextInput id="messageInput"/>
    </mx:FormItem>
    <s:Button click="{remoteObject.addMessage(nameInput.text, messageInput.text, new Date())}" label="Send"/>
  </mx:Form>
</s:Application>

Yep that is Flex 4, my first Flex 4 app in my blog :)

So now we compile it and we have our swf. For this example I will upload it to http://sites.google.com/ which I use to publish my files to.
There is one last thing to do, to create and configure a crossdomain.xml on our server.

We create on out local machine crossdomain.xml looking like:

<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy 
  SYSTEM "http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
   <allow-access-from domain="*.googlegroups.com" />
</cross-domain-policy>

The weakness here is that everyone from *.googlegroups.com can connect, but as this is an example it is not a problem, and I don't think someone will be that interested :)

Now with your favorite ftp client, connect it to host: s215.eatj.com port:21 your account's username and password. Navigate to /webapps/ROOT and copy the crossdomain.xml there.

Click here to see the result. EDIT: Unfortunately the eatj trial account shuts down the server 6 hours after it was started. That's why sometimes you wont be able to connect to the server

Source code:
spring-flex-server
FlexSpring