Forums: Flash:

 

server-side proxies: what to do with image data?

first
 

baron ruhstoff server-side proxies: what to do with image data?

So... I'm currently trying to load an image from Amazon via a server-side proxy.

There isn't a friendly crossdomain file where the the image is located (e.g. an album cover), but the proxy is doing what it should and gets the jpg.

Actually, I should be more specific - it returns the jpg data. I don't have a clue what to do with it.

For shits and giggles, here's a bit of what I get when I dump the result:

ÿØÿà�JFIF������ÿÛ�C�!"$"$ÿÛ�CÿÀ��J�K"�ÿÄ����������� ÿÄ


...which I'm assuming is raw bitmap data. This is how I'm getting it (a ColdFusion component accessed via NetServices):

<!--- Server-side proxy for getting around absence of a friendly crossdomain file --->
<cffunction name="getDataViaProxy" access="remote" returntype="any">
<cfargument name="url" type="string" required="yes" />
<cfhttp url="#ARGUMENTS.url#" method="get" redirect="no" timeout="10"/>
<cfreturn cfhttp.FileContent />
</cffunction>


And this is how I'm receiving it:

// handle image data retrieval success
private function getAlbumCoverImageViaProxy_Result(bmp:*):void {
// the ideal would be to put the data in a friendly format here
// and THEN pass it on.
var r:Request = new Request();
r.setMessage("onAlbumCoverImageViaProxy");
r.setData(bmp);
_mp.onRequest(r);
}



Here's what I'd like to know:

1. What type of object should I tell Flash to expect from the call ?
2. Once I have the result, what do I do with it to get it to display? Is it simply a matter of addChild(result), or does it need to be cast as a bitmap, bitmapdata, etc.?
3. What was the serial number of the V2 rocket in Gravity's Rainbow?

 

lithium

1. and 2.
if it's binary image data, you should be able to use a Loader object with a URLStream.



var data:URLStream = new URLStream();
data.addEventListener( Event.COMPLETE, onDataLoad );
data.load ( new URLRequest ( "http://static.howstuffworks.com/gif/nuclear-test-2.jpg" ) );

function onDataLoad ( evt:Event ):void
{
var bytes:ByteArray = new ByteArray();

var loader:URLStream = evt.target as URLStream;
loader.readBytes( bytes , bytes.length );

var image:Loader = new Loader();
image.loadBytes( bytes );

this.addChild ( image );


}





3. 00000

hope it helps,

/lith.

 

baron ruhstoff

Cool. Still ran into the crossdomain issue, though. I'll see about running that ByteArray trickery on the results from the proxy tomorrow.

Pirate would be proud. big grin

Thanks!

 

baron ruhstoff

Gave it another shot. Still no luck.

Here's the trace of what Flash receives from the proxy (returns data as a string) before any parsing:

ÿØÿà


and here's what I'm doing with it:
		// handle image data retrieval success
private function getAlbumCoverImageViaProxy_Result(bmp:*):void {
trc(bmp); // example output: "ÿØÿà"
var bytes:ByteArray = new ByteArray();
var loader:URLStream = bmp as URLStream;
loader.readBytes(bytes, bytes.length); // this line throws a null object reference error
var image:Loader = new Loader();
image.loadBytes(bytes);

// done
var r:Request = new Request();
r.setMessage("onAlbumCoverImageViaProxy");
r.setData(image);
_mp.onRequest(r);
}


I don't know that much about ByteArray or URLStream. I'll look into them some more.

// edit: Wait... Shouldn't var bytes be given a value beyond mere instantiation before calling loader.readBytes?

 

baron ruhstoff

fwiw: Changed the returntype of the proxy to binary. Here's the start of what Flash receives now:

-1,-40,-1,-32,0,16,74,70,73,70,0,1,1,0 ...


which should have the makings of a ByteArray, no? If I load it into a Loader via loadBytes, I get a type coercion error: "cannot convert []@12a29f41 to flash.utils.ByteArray".

 

baron ruhstoff

Getting closer. The image now displays, but can't be smoothed.

The key was to populate the ByteArray manually:

		// handle image data retrieval success
private function getAlbumCoverImageViaProxy_Result(bmp:*):void {
// make the binary data workable
var bytes:ByteArray = new ByteArray();
var len:int = bmp.length;
for (var i:int = 0; i < len; i++) {
bytes[i] = bmp[i];
}

// make the binary data displayable
var loader:Loader = new Loader();
loader.loadBytes(bytes);

// done
var r:Request = new Request();
r.setMessage("onAlbumCoverImageFromProxy");
r.setData(loader);
_mp.onRequest(r);
}


followed up, of course, by:
		// when we've received the image data from the proxy
public function updateAlbumImageWithProxyData(img:Loader):void {
var mcHolder:MovieClip = new MovieClip();
mcHolder.addChild(img);
... and so forth
}


This gets the image to display, but I need to trick it out a bit:
		// when we've received the image data from the proxy
public function updateAlbumImageWithProxyData(loader:Loader):void {
loader.cacheAsBitmap = true; // WIN!
loader.smoothing = true; // FAIL

var mcHolder:MovieClip = new MovieClip();
mcHolder.addChild(loader);
... and so forth
}


I would be working with loader.content, but it isn't defined. I'm assuming this is a consequence of loading the ByteArray. Anywho, when I try to set smoothing I get a big fat FAIL of a null object reference.

So... What needs to be done to allow smoothing?

 

lithium

the code i posted works perfectly for me, so it's strange that you've had to go to such levels in order to get it to show.

As for the smoothing issue, you're probably best off making a new bitmap out of the loader. give this a shot:



var data:URLStream = new URLStream();
data.addEventListener( Event.COMPLETE, onDataLoad );
data.load ( new URLRequest ( "http://static.howstuffworks.com/gif/nuclear-test-2.jpg" ) );

function onDataLoad ( evt:Event ):void
{
var bytes:ByteArray = new ByteArray();

var loader:URLStream = evt.target as URLStream;
loader.readBytes( bytes , bytes.length );

var image:Loader = new Loader();
image.contentLoaderInfo.addEventListener ( Event.COMPLETE, smoothBitmap );
image.loadBytes( bytes );


}

function smoothBitmap ( evt:Event ):void
{
var image:Loader = ( evt.target.loader as Loader );

var bd:BitmapData = new BitmapData ( image.width, image.height, false, 0x000000 );

var mat:Matrix = new Matrix();

bd.draw ( image , mat, image.transform.colorTransform, BlendMode.NORMAL, bd.rect, true );

var bitmap:Bitmap = new Bitmap( bd, PixelSnapping.AUTO, true );

this.addChild ( bitmap );
}

 

baron ruhstoff

Your way works great as long as there isn't a crossdomain file spreading hate all around.

From the looks of it, your jpg is fair game. I need to access ecx.images-amazon.com, though, which has a file that is decidedly unfriendly, hence the proxy and messing about with binary data.

 
first
 

Forums: Flash: server-side proxies: what to do with image data?

 
New Post
 
You must be logged in to post