Flex on Grails: An one line Groovy proxy for cross domain communication for Flex

When trying to access external websites like the Flickr API or Google domains with Flex, we often run into the dreaded #2148 Security Exception error. . In this post, I show you how easy it is to solve this using Groovy and Grails ( it’s one line ).

The Problem

This is the scenario, you develop your Flex application locally. Everything works fine until you deploy into your server. Then you start seeing a cross-domain security exception. It happens that Flex and Flash requires you to have a crossdomain.xml file loaded and authorized in order to access data from another site. There is no way around this, it cannot be turned off.

A solution used by PHP developers is to proxy the website, serving the same content via the server that made the call. Instead of calling http://www.flickr.com/api, they simply call http://www.my.server.com/flickr, which in turn retrieves the page and gets rid of all security exceptions.

The Grails Way

To do this in Grails, you just have to add a new function to your controller.

  1. Create a new app – grails create-app myapp
  2. Create a new controller – grails create-controller flexproxy
  3. open your /grails-app/controllers/flexproxy.groovy file
  4. modify the index function to be the following :
index(){
     render new URL( params.url ).getText()
} 

save the function.

From then on, you can just call http://localhost:8080/myapp/flexproxy?url=http://www.flickr.com/api to proxy your files. Remember to URL encode.

Going Beyond

Of course, we usually want to do something more sophisticated than this. With Grails, I am also able to convert this content into another format.

Here is the example of the function that takes a google sets result set and returns a list in XML I use in the Haiku Generator.

import grails.converters.*

class HaikuController {

        def index = {
	}
	
	def words = {
		def pageContent = new URL( "http://labs.google.com/sets?hl=en" 
               + "&q1=${params.q1?:''}" +
                   "&q2={params.q2?:''}"+
                   "&q3=${params.q3?:''}"+
                   "&q4=${params.q4?:''}" +
                   "&q5=${params.q5?:''}"&btn=Large+Set" ).getText()
		def words = []
		pageContent.eachLine() { line ->
			if( line.contains('http://www.google.com/search?hl=en&amp') ){
		     	  def word = line.split('</a>')[0]
		          word = word.substring(word.lastIndexOf('>')+1)
		          words.add( word )
			}
		}
		render words as XML
	}
}

In this code, I pass in the parameters individually via the Grails params method. Instead of simply returning the entire page, I use the Grails XML converter to return a XML list. This makes processing these results much simpler in Flex, as I can then just bind this resultset to the XMLListCollection.

You can try this out by visiting http://tomaslin.appspot.com/haiku/words?q1=test&q2=test2 – change the q1 to q5 values and you get the Google Sets resultset in an XML file. It’s easy to build simple web services with this method.

Hope that helped. Remember to visit www.empora.com – a new way to search for fashion online.

3 thoughts on “Flex on Grails: An one line Groovy proxy for cross domain communication for Flex

  1. Oleg K.

    Hi,

    I am trying to create Flex app which can work in both online and offline mode, it also needs to connect to the scanner via DLLs (written in C++, not .NET)

    So I need to connect Flex code to applet (which connects to DLL). I was able to connect SWF via ExternalInterface, but it didn’t work for AIR – was getting security exceptions. And Merapi is not released yet.
    Can I use your Flex-on-Grails to do AIR-to-applet connection ? In that case, how do I connect Grails to applet ?

    Any advice is very appreciated.

    TIA,
    Oleg.

    Reply
  2. Pingback: 5 Reasons for Flex Developers to consider a Grails / Google App Engine Backend « Tomás Lin’s Programming Brain Dump

  3. TAulich

    Thanks a lot for this tip! It helped me a lot for implementing a Cross-Site scripting in my Webapp for Mobile devices. Great!!!

    Reply

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