Flex 2.0 Image Saving.
September 8th, 2006 [ Posted by admin ]I’ve seen a little bit of discussion on the Flexcoders mailing list recently regarding saving images created in a flex app to the server. Most of the solutions revolved around using HTTP to get the image from the flash player to the server. This had proved difficult for numerous reason. So I set out to try and find a simpler way. Now knowing that AMF is a binary protocol I figured it must be possible to send the binary image data to the server using Remoting.
And indeed it is. In fact it’s stunningly simple. The actual heavy lifting has already been done for us by Tinic Uro in his Image Encoding classes. All I had to do was capture the image data, encode it using Tinic’s classes and then send it to a ColdFusion CFC via remoting. I’ve put it up as a demo so you can see it in action.
The flex part is standard Remoting so you can look at the code in the download to see that part but the ColdFusion is shown below.
<cffunction name="upload" access="remote" returntype="string">
<cfargument name="ext" type="string" required="true">
<cfargument name="img" type="binary" required="true">
<cfset var name = "image" & dateFormat(now(), "yyyymmdd") &
timeFormat(now(), "HHmmss") & "." & arguments.ext>
<cffile action="write" file="#expandPath("..\images\#name#")#"
output="#img#" addnewline="false" >
<cfreturn "/images/#name#">
</cffunction>
As you can see the code required in ColdFusion to do a relatively complex task is minimal, it can all be boiled down to two things:
- Setting the argument type of the image data to binary (I’m not even sure this is required).
- Using the cffile tag to save that binary data to a file.
See I told you it was simple. Feel free to download the Image Upload Code and try it out for youself.
Del.icio.us
Technorati
Digg
Slashdot
September 18th, 2006 at 11:27 am
Wow,
How easy is that. Nice one Mike…
Hilary
–
November 10th, 2006 at 1:48 pm
Stunningly simple indeed … should be a snap to add a browse capability for images in case the user doesn’t have a webcam :) Impressive!
–Jeff
January 25th, 2007 at 1:26 pm
Thanks for this great example.
However, I ran into a problem in a AS3 only project, no Flex involved.
Do you have an idea what is happening here ?
This code always throws an error: The argument IMG passed to function saveToDisk() is not of type binary.
Actionscript:
=========
var picture:Picture = Slideshow.getInstance().getPicture();
var bmp:BitmapData = new BitmapData(picture.width,picture.height,false);
bmp.draw(picture);
var myPNG:ByteArray = PNGEncoder.encode(bmp);
remoteCon.saveToDisk(“png”,myPNG);
Coldfusion:
========
….
Btw: these classes are now an integral part of the open source Adobe AS3 corelib:
http://code.google.com/p/as3corelib/
January 25th, 2007 at 2:41 pm
Wedevotion
When you say no Flex involved do you mean you are using the flash 9/CS3 beta or did you mean no MXML involved.
How did you set up the remoting object – remoteCon??
I see you have renamed the ColdFusion function did you change anything else??
If you send me a more complete code example I can take a look for you.
Mike.
January 26th, 2007 at 12:25 pm
Hey Mike,
The project is an AS3 only project, no mxml involved, only AS3 in Flex Builder.
My guess is that it’s an AMF0 – AMF3 problem or it could be a coldfusion
version issue.
Coldfusion would not accept my img data as a binary.
I fixed the problem by encoding the jpgencoded bytearray into a base64 string.
That base64 string is send to my cfc method, which decodes it into a binary
using toBinary( myBase64EncodedString ).
This binary is written with the cffile tag.
Quite a bug hunt, but it was worth it! The base64 encoder is not an Adobe class;
as it is not a part of the AS3 packages, but it’s available in the Flex packages.
I downloaded a class I found on the net.
February 5th, 2007 at 10:35 am
Ah, yes ColdFusion needs to be updated to version 7.0.2 to use AMF3 which is needed to send a ByteArray. So without these capabilities the simplicity is lost some what. Sorry for not pointing out those requirements.
November 27th, 2008 at 8:26 am
I have one question:
Do you know if this cfc working with coldfusion 8? I have tried and I got one error!
In coldfusion 7 working fine!
July 21st, 2009 at 4:44 pm
This function is what I am looking for in one of my Flex projects, but as a newby the code snippets are not wholly coherent to me.
Can you PLEASE :) make the project available as a zip? I was considering Sothink sqf to flex but would love it if you could share this in entirety.
pretty please??