Add Comment
Moving Binary data Between Coldfusion and Flex
Flex / ColdFusion Tutorial #12
This tutorial deals with getting raw image data from the Coldfusion server and sending it back to Flex via a RemoteObject call and what to do with the data on each end once it is received. The Connect presentaion can be seen here: http://experts.na3.acrobat.com/p37889200/
Main.mxml
I started with a pretty basic layout for my application. I have a ComboBox that displays the names of the available gallerys, a datagrid display the art in that gallery. Double clicking on a art entry in the grid will show the Edit info popup where you can view the image and change the data.I define my RemoteObject and the methods I want to call. Each of the methods in my RemoteObject correspond to it’s counterpart in the CFC. The rest of the MXML is basic layout, population of the combo box and datagrid.
ArtInfoWindow.mxml
The key point in this component are how we assign binay data from Coldfusion directly into the image component.The getArtResultHandler() method is the handler called by the result event from calling getArt(). Here’s where we start to see how we handle the image data returned from ColdFusion.
First I create a new Image and set it’s height and width to the returned Height and Width values.
Next we set the data property of the Image equal to the returned binary blob. This was the data we got when we used the ImageGetBlob() function in our CFC. Binary data in ColdFusion is the same as a ByteArray in Flex, and since the data attribute of our image expects a ByteArray we can pass the returned value right in without any data casting or translation. Pretty cool huh?
artgallery.cfc
Artgallery.cfc basically is the "go between" for the database and flex. In it I'm trying to show the different ways to return data from CF to Flex. In a couple methods I'm returning a query and in another I'm returning a struct and using the ['MyVar'] case to show how to preserve camel case variables.art.cfc
This is the DAO to where all the SQL is taking place.Demo
See this code running!
Download
Download this code as a zip!
Comments
Hi and thank you for the tutorial. I am wondering which method is faster - this or to send the imagepath from the database and then load. I am using CF and Flex Gumbo. My data grid and image renderer are paged.Thanks!
Jeff
Jeff @ Friday 04 Sep 2009 - 04:49:50 AM
Sending the link to the file will always be faster in the initial transfer, however you're browser will still have to retrieve the image at some point.
I haven't run any speed tests, but if the image files are small then I don't think you would see any difference. I like this method only because it reduces the number of requests Flex has to make to get the image.
Steve Good @ Sunday 06 Sep 2009 - 01:13:05 PM
is there a way to contact you via email or phone number...
Seema @ Tuesday 03 Nov 2009 - 02:51:26 AM
Absolutely. sgood [at] lanctr [dot] com
Steve Good @ Tuesday 03 Nov 2009 - 02:59:52 AM
Click button to add a comment
Author
Steve Good