CODEWITHSUNDEEP
jqueryjson
Richard Stokes
Richard Stokes

Reputation: 3552

jQuery parseJSON error

I'm trying to parse a JSON string served up from my Sinatra/DataMapper backend, but am getting an error from $.parseJSON. The offending line is:

var data = $.parseJSON('{"id":1249,"ssid":"asdf","mac_addr":"12:34:56:78:90:12","description":"<a href=\"http://www.google.com\">Google</a>","gps_lat":"53.345036547354","gps_lng":"-6.2576787407226675","location":"","authentication_method":"WPA2-PSK","password":"","xml_id":"default","access_network_area_id":37}');

And the error appearing in Firebug is:

SyntaxError: JSON.parse: expected ',' or '}' after property value in object

Since I can't for the life of me see any missing ',' or '}' symbols (and there shouldn't be unless the ruby to_json method is broken), I'm assuming this is an escaping issue. But which characters do I need to escape to fix it?

EDIT:

My backend is Sinatra (Ruby), with DataMapper as the ORM. The JSON string is being generated in the controller as @data = model.to_json, and is being handled in the view as $.parseJSON('#{@data}').

Upvotes: 2

Views: 5269

Answers (1)

lanzz
lanzz

Reputation: 43158

Your JSON string is insufficiently escaped — there are single backslashes before the quotes inside the content of the description key; since backslashes are special symbols inside Javascript strings, \" results in an unescaped " character in the actual string. Those backslashes need to be doubled in order to remain as literal characters in the string, making it a valid JSON representation.

This corrected JSON string works as expected:

var data = $.parseJSON('{"id":1249,"ssid":"asdf","mac_addr":"12:34:56:78:90:12","description":"<a href=\\"http://www.google.com\\">Google</a>","gps_lat":"53.345036547354","gps_lng":"-6.2576787407226675","location":"","authentication_method":"WPA2-PSK","password":"","xml_id":"default","access_network_area_id":37}');

I suspect you generate your Javascript code with something like this pseudocode:

print "var data = $.parseJSON('" + json_string + "')"

Simple wrapping of a string inside quotes is not enough to ensure its literal value remains the same in the generated Javascript code. In order to protect the string from such special-character issues, usually it is enough to wrap it in an additional JSON encoding instead of wrapping in single quotes:

print "var data = $.parseJSON(" + json_encode(json_string) + ")"

Since JSON encoding produces valid Javascript data structures, JSON-encoding a simple string will result in a properly quoted Javascript string. Though, to be fair, you might be able to skip the intermediate JSON decoding step altogether, if your JSON comes from a trusted source:

print "var data = " + json_string

Upvotes: 5

Related Questions