Action Script 3 - Posting a JSON to a RESTful server - ajax

Question

I'm trying to POST a simple JSON object to a RESTfull server using the following code:
var messages:Array = new Array ();
messages.push ({"name":"MyName"});
var vars: URLVariables = new URLVariables();
vars.data = JSON.stringify(messages);
var urlRequest:URLRequest= new URLRequest("http://localhost:8080/xxx/player/createAccount");
urlRequest.method = URLRequestMethod.POST;
urlRequest.data = vars;
var hdr:URLRequestHeader = new URLRequestHeader("Content-type", "application/json");
urlRequest.requestHeaders.push(hdr);
_urlLoader = new URLLoader();
_urlLoader.addEventListener(Event.COMPLETE, onXMLDataLoaded);
_urlLoader.load(urlRequest);
My object is a simple one, it contains a field called {"name" : "MyName"}
The server fails to recognize the request's data.
the request on the network monitor shows this:
POST http://localhost:8080/xxx/player/createAccount HTTP/1.1
Host: localhost:8080
Connection: keep-alive
Content-Length: 42
Pragma: no-cache
Cache-Control: no-cache
Origin: http://localhost:8080
X-Requested-With: ShockwaveFlash/15.0.0.223
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.65 Safari/537.36
Content-Type: application/json
Accept: */*
Referer: http://localhost:8080/xxx/flashClient/lobby.swf
Accept-Encoding: gzip, deflate
Accept-Language: en-US,en;q=0.8,he;q=0.6
Cookie: JSESSIONID=1841C3CBE7511794A4EEF8A1A0BD56DD
data=%5B%7B%22name%22%3A%22MyName%22%7D%5D
A working post request looks like this on the network monitor tool:
POST http://localhost:8080/xxx/player/createAccount HTTP/1.1
Host: localhost:8080
Connection: keep-alive
Content-Length: 20
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.65 Safari/537.36
Origin: chrome-extension://cdjfedloinmbppobahmonnjigpmlajcd
Content-Type: application/json
Accept: */*
Accept-Encoding: gzip, deflate
Accept-Language: en-US,en;q=0.8,he;q=0.6
Cookie: JSESSIONID=1841C3CBE7511794A4EEF8A1A0BD56DD
{ "name" : "MyName"}
Any ideas how can I make the first request perform like the second one?

Answer 1

If you're content type is application/json, then you don't want to use URLVariables for your data:
//this is causing the problem because it's encoding your JSON string so it's url safe.
var vars: URLVariables = new URLVariables();
vars.data = JSON.stringify(messages);
Instead, assign the stringified JSON directly to the URLRequest's data property like in the following example:
var urlRequest:URLRequest= new URLRequest("http://localhost:8080/xxx/player/createAccount");
urlRequest.method = URLRequestMethod.POST;
urlRequest.data = JSON.stringify({"name":"MyName"});
var hdr:URLRequestHeader = new URLRequestHeader("Content-type", "application/json");
urlRequest.requestHeaders.push(hdr);
_urlLoader = new URLLoader();
_urlLoader.addEventListener(Event.COMPLETE, onXMLDataLoaded);
_urlLoader.load(urlRequest);
P.S. There is a good tutorial that can help with understanding REST paradigm.