Sunday, February 27, 2011

Working with JSON and AS3: Part 2

Today we'll learn how to parse JSON to use in AS3.

As I said in the previous tutorial, I will use the as3corelib library.

I saved this data to a staff.txt file as an example on how to load and decode the data. Most of the time the JSON data will not be loaded from a file, but received from other programs (which generate the JSON line). Here's the staff.txt I have:

{
"staff":
[
 {
 "firstName":"John",
 "lastName":"Parker",
 "age":"32",
 "country":"Canada",
 "job":"Programmer"
 },

 {
 "firstName":"Peter",
 "lastName":"Anderson",
 "age":"30",
 "country":"USA",
 "job":"System administrator"
 },

 {
 "firstName":"Bob",
 "lastName":"Johnson",
 "age":"35",
 "country":"Canada",
 "job":"Coder"
 }
]
}

Now, let's parse it using AS3.

Firstly, I import the necessary JSON class (I have the com folder in the same directory as my flash code):

import com.adobe.serialization.json.JSON;

Now I simply load data from the external text file using an URLRequest:

var myRequest:URLRequest = new URLRequest("staff.txt");
var myLoader = new URLLoader();
myLoader.addEventListener(Event.COMPLETE, onload);
myLoader.load(myRequest);

function onload(evt:Event):void
{

And now I create a new Object variable, which will now hold all the JSON data we've received. I apply the data to the object using JSON.decode() method from the library.

var myData:Object = JSON.decode(myLoader.data);

Now it is an object and I can refer to its properties like this:

trace(myData.staff[0].firstName);

Outputs: John.

Simple, isn't it?

Here's the full code:

import com.adobe.serialization.json.JSON;

var myRequest:URLRequest = new URLRequest("staff.txt");
var myLoader = new URLLoader();
myLoader.addEventListener(Event.COMPLETE, onload);
myLoader.load(myRequest);

function onload(evt:Event):void
{
var myData:Object = JSON.decode(myLoader.data);

trace(myData.staff[0].firstName);
}

Thanks for reading!

Related:

Working with JSON and AS3: Part 1
Working with JSON and AS3: Part 3

9 comments:

Anonymous said...

Thank you for posting this.
I am absolute beginner in as3 and JSON, please provide me with info about com folder that you are referencing?
Where do you get that folder? And how did you implement that as3corelib-.93 into project.

Thanks

Kirill Poletaev said...

As3corelib is a custom class library with a plenty of useful classes, you can download it by following the link in this tutorial.

When you downloaded it, extract it somewhere, then open the src folder and you will find the com folder. Put the 'com' folder with all its contents in the same directory with your .fla file and you will now be able to refer to it like I did in this tutorial.

Mel Wood said...

Thanks you so much for this tutorial. Been struggling with as3 and JSON for most of this afternoon until I read your blog post.

I do have one question though; how come the JSON file has to be a .txt file? I'm having a mare trying to get it to read a .ini JSON file. Is it because as3 doesn't have native support for JSON - hence the as3corelib?

Cheers, mel

Kirill Poletaev said...

Well, actually, you could read any file with any extension. The only trick is that after you read UTF bytes, it has to be plain json text that can be then parsed by as3corelib.

Anonymous said...

Im getting an error: 1061: Call to a possibly undefined method decode through a reference with static type Class.

on line: var myData:Object = JSON.decode(myLoader.data);

I have placed the "com" folder in my project and imported the json method.

Anonymous said...

Its me again, It seems using Flash CS6 does not require the libary, Simply use JSON.parse()

Thanks for the blog anyways - It got me on the right path :D

Anonymous said...

Hi and thanks for a great tutorial!

Question: If your JSON file looks like this:

[
{
"firstName":"John",
"lastName":"Parker",
"age":"32",
"country":"Canada",
"job":"Programmer"
}
]

(Staff is no longer present.)

How would you do this?

Thank you so much!

Paulius Tarvydas said...

Hello. where should i put extracted "as3corelib" library file?

Chandra Sekhar Bhusal said...

can any one explain why to decode the json file while using in as3

Post a Comment