AS3 Object To JSON

Question

I'm trying to convert an array of objects (nested) to JSON string. Here is my JSON output:

[{
    "Width": 570,
    "SessionID": 2003404006158805,
    "Price": "69,90",
    "PageCount": 24,
    "Pages": [{
        "ID": 1,
        "TemplateID": 0,
        "PageType": "cover",
        "TextContainers": [],
        "ImageContainers": []
    }, {
        "ID": 2,
        "TemplateID": 1001,
        "PageType": "single",
        "TextContainers": [],
        "ImageContainers": []
    }, {
        "ID": 3,
        "TemplateID": 0,
        "PageType": "double",
        "TextContainers": [],
        "ImageContainers": [{
            "Width": 570,
            "IsBG": true,
            "Brightness": 0,
            "Contrast": 0,
            "PosX": null,
            "ScaleX": null,
            "Height": 284,
            "ID": -1,
            "BlackWhite": 0,
            "PosY": null,
            "HasPhoto": false,
            "ScaleY": null,
            "PhotoID": null
        }]
    }, {
        "ID": 4,
        "TemplateID": 0,
        "PageType": "double",
        "TextContainers": [],
        "ImageContainers": [{
            "Width": 570,
            "IsBG": true,
            "Brightness": 0,
            "Contrast": 0,
            "PosX": null,
            "ScaleX": null,
            "Height": 284,
            "ID": -1,
            "BlackWhite": 0,
            "PosY": null,
            "HasPhoto": false,
            "ScaleY": null,
            "PhotoID": null
        }]
    }],
    "ProductSubID": 0,
    "Height": 620,
    "ProductID": 0
}]

And when I'm trying to convert this string to XML (at server side) comes out like this:

<?xml version="1.0" encoding="UTF-8" ?>
    <0>
        <Width>570</Width>
        <SessionID>2003404006158805</SessionID>
        <Price>69,90</Price>
        <PageCount>24</PageCount>
        <Pages>
            <ID>1</ID>
            <TemplateID>0</TemplateID>
            <PageType>cover</PageType>
        </Pages>
        <Pages>
            <ID>2</ID>
            <TemplateID>1001</TemplateID>
            <PageType>single</PageType>
        </Pages>
        <Pages>
            <ID>3</ID>
            <TemplateID>0</TemplateID>
            <PageType>double</PageType>
            <ImageContainers>
                <Width>570</Width>
                <IsBG>true</IsBG>
                <Brightness>0</Brightness>
                <Contrast>0</Contrast>
                <PosX />
                <ScaleX />
                <Height>284</Height>
                <ID>-1</ID>
                <BlackWhite>0</BlackWhite>
                <PosY />
                <HasPhoto>false</HasPhoto>
                <ScaleY />
                <PhotoID />
            </ImageContainers>
        </Pages>
        <Pages>
            <ID>4</ID>
            <TemplateID>0</TemplateID>
            <PageType>double</PageType>
            <ImageContainers>
                <Width>570</Width>
                <IsBG>true</IsBG>
                <Brightness>0</Brightness>
                <Contrast>0</Contrast>
                <PosX />
                <ScaleX />
                <Height>284</Height>
                <ID>-1</ID>
                <BlackWhite>0</BlackWhite>
                <PosY />
                <HasPhoto>false</HasPhoto>
                <ScaleY />
                <PhotoID />
            </ImageContainers>
        </Pages>
        <ProductSubID>0</ProductSubID>
        <Height>620</Height>
        <ProductID>0</ProductID>
    </0>

But I need it to be like:

<pages>
<page>
</page>
<page>
</page>
</pages>

This is my AS code to convert Object arrays into JSON

var Pages:Array = [];
            var Books:Array = [];
            var JBook:Object = new Object();

            JBook.Width = Global.BOOK_WIDTH;

            for(var i:Number = 0; i<Global.PAGES.length; i++)
            {
                var Page:PageVO = Global.PAGES[i] as PageVO;
                var JPage:Object = new Object();
                JPage.ID = Page.ID;

                var ImageContainers:Array = [];
                var TextContainers:Array = [];
                var Template:TemplateVO = Page.ACTIVE_TEMPLATE;

                for(var j:Number = 0; j<Template.IMAGE_CONTAINERS.length; j++)
                {
                    var ImageContainer:ImageContainerVO = Template.IMAGE_CONTAINERS[j] as ImageContainerVO;
                    var JImageContainer:Object = new Object();
                    JImageContainer.ID = ImageContainer.ID;
                    ImageContainers.push(JImageContainer);
                }

                for (var m:Number = 0; m<Template.TEXT_CONTAINERS.length; m++)
                {
                    var TextContainer:TextContainerVO = Template.TEXT_CONTAINERS[m] as TextContainerVO;
                    var JTextContainer:Object = new Object();
                    JTextContainer.ID = TextContainer.ID;
                }

                JPage.TextContainers = TextContainers;
                JPage.ImageContainers = ImageContainers;
                Pages.push(JPage);
            }

            var Photos:Array = [];
            for(var p:Number = 0; p<Global.PHOTOS.length; p++ )
            {
                var Photo:PhotoVO = Global.PHOTOS[p] as PhotoVO;
                var JPhoto:Object = new Object();
                JPhoto.BMP = ImageUtils.BitmapToBase64(Photo.BMP.bitmapData);
                JPhoto.UseCount = Photo.USE_COUNT;
                JPhoto.ID = Photo.ID;
                Photos.push(JPhoto);
            }


            //JBook.Photos = Photos;
            JBook.Pages = Pages;
        JSON   = com.adobe.serialization.json.JSON.encode(Books);

Any idea why it's rendering JSON string like they are not in the same node (seperate node for every page item)?

Hope I've been clear. Thanks.

Answer 1

Probably the easiest way to convert from an AS3 object to a JSON string is to use the JSON class from as3corelib.

Example usage:

var jsonString:String = JSON.encode(myDataObject);

It is probably best not to write your own parser, as the as3corelib JSON parser has been worked on and used by many people, for quite some time.

EDIT: @dpcao mentioned that you don't even need an external library anymore, Adobe introduced a new JSON class available in FlashPlayer 11.

Example usage:

var jsonString:String = JSON.stringify(myDataObject);

Answer 2

Are you iterating through a native object? Or through an XML Object? Because if you're iterating an [XMLList][1] you should use length(), not length (they named it as a function to avoid name collections)

But honestly, use JSONLib, or [natively][2], with Flash Player 10.3 or above, use it natively. It mimics the javascript api, with JSON.parse and JSON.stringify respectively. This shouldn't be an issue with JSON serialization, you might have a bug either server side or client side with your serialization. I would suggest adding a serialize() function to each of your objects -- this makes it easier in the long run to maintain anyways. ie:

class PageVO {
  function serialize():Object {
    return {
       ID: some_id,
       Template_ID: some_template_id,
       // add image containers here
    }
  }
}

This will make it easier to debug individual objects to see where the problem is coming from. As it looks, there's no reason why your code shouldn't work. However, there might be issues with the actionscript serialization class and not adding a variable node: i.e. serializing [], rather than { "name": value }. Try the native serializer and see what happens. (don't forget -swf-version=16)