Build a URLRequest with headers of multipart/form-data content type with ActionScript









Posting an image on a platform which requires it to be of a ‘multipart/form-data’ content type is different from posting a URL link of an image or sending an image as binary data.

For example, both Flickr and Facebook APIs require the ‘multipart/form-data’ type for uploading images and in the latter case I never realized it because there was an existing Facebook API which was doing the work behind the scenes.

Incase of Facebook, if you are using the Facebook Actionscript3 SDK for posting images to your own wall, you are required to convert your image into a ByteArray and then use the API to POST the image. The classes that handle this are the, and, but as a developer you may never know of these classes or use them directly.

For instance the code below captures a Movieclip from the stage as a bitmap, encodes it as a PNG and then uploads it to your Facebook wall using the Facebook Actionscript3 SDK.

var bitmapD:BitmapData = new BitmapData(movieClip.width,movieClip.height);

var imageStream = PNGEncoder.encode(bitmapData);

var values:Object = {message:"A test to post image" , fileName:'anyname.jpg' , image:imageStream};  
FacebookMobile.api('/me/photos', onCheckResult, values,'POST');

In my case I did not have any SDK or classes to work with this particular content type. That’s when I read about the class written by Jonathan Marston. It is an old class written in 2007 so it needed minor modifications to work with today, but nonetheless, it served the purpose of building a POST request with properly formatted headers required by the server to interpret the content of multipart/form-data type.
Assuming if I had to rewrite the code to post an image to Facebook without an SDK, the code below would work just as well.

var bitmapD:BitmapData = new BitmapData(movieClip.width,movieClip.height);

var imageStream = PNGEncoder.encode(bitmapData);

function postData():void{
    var loader:URLLoader = new URLLoader();
    var urlRequest:URLRequest = new URLRequest();	
    var variables:URLVariables = new URLVariables();

    urlRequest.url = "";
    urlRequest.contentType = "multipart/form-data; boundary=" + UploadPostHelper.getBoundary();
    urlRequest.method = URLRequestMethod.POST;
    var postVariables:Object = {}
    if (this.accessToken != ""){
	postVariables.access_token = this.accessToken;
    postVariables.message = "A test to post image"; = UploadPostHelper.getPostData("anyname.jpg", imageStream, postVariables);
    urlRequest.requestHeaders.push( new URLRequestHeader( 'Cache-Control', 'no-cache' ) );
    loader.dataFormat = URLLoaderDataFormat.BINARY;

Write to me if you want the class with the changes I’ve made to it or have suggestions to work with image data.


About the Author

Part geeky part quirky, I love writing games, travelling the world, trying new food and learning new languages. I am sometimes the designer, programmer and artist for some of my own games.

Related Posts

Discussion One Comment

  1. Dian says:

    dear Mariam,

    Thanks for this post. I think it gonna save my day as I am building an app for Facebook from flash. May I get your modified

    Thanks a lot! :)

Leave a Reply

Adobe Community Champions
Nokia Developer Champion
My Nokia Developer Blog
My Nokia Developer Personal Introduction Page
View Mariam Dholkawala's profile on LinkedIn

Add me to Skype
%d bloggers like this: