Why does json.parse break? and how to fix it - javascript

I have the following data coming in from my server into my js code, from my server.
{"triggers": [{"message_type": "sms","recipients": "[\"+91xxxxxxxxx\",\"+91xxxxxxxxx\"]","message": "This is a test"}]}
My code parses the above json string in the following manner.
data = '{"triggers": [{"message_type": "sms","recipients": "[\"+91xxxxxxxx\",\"+91xxxxxxxx\"]","message": "This is a test"}]}'
parsed = JSON.parse(data);
This throws the following exception
Uncaught SyntaxError: Unexpected token + in JSON at position 54
at JSON.parse (<anonymous>)
at eval (eval at <anonymous> (entry.html:2), <anonymous>:1:6)
at entry.html:298
I did a little bit of further digging and found the source of the json string.
Here is where the string is coming in from my python code
data = {"recipients": "[\"+91xxxxxxxxx\",\"+91xxxxxxxx\"]"} # This data comes in from my database, and I can't do anything about what quotes are used.
javascript_supplied_data = json.dumps(data) #This data goes to the frontend via webhook
I tried putting the same data into a json view via this online viewer, and it didn't throw any error and displayed the data correctly.
What I can't understand is, I am doing a json.dumps in my python code, so the string response should be json parsable. So why does JSON.parse throw this error?
Is there something wrong with the json libraries at the python end or the javascript end, or am I too much of a noob?.
Please help me figure out what is causing this issue, and how to solve it.
NOTE: I don't have any control over the string that comes in from the server.

When you have valid JSON, but put it in a string literal, the escapes treated by the literal notation in JavaScript make the string different. The backslashes are interpreted as for escaping the next character.
So either you have to go through the string literal and double all the backslashes, or you can apply String.raw to the string literal as template string:
var data = String.raw`{"triggers": [{"message_type": "sms","recipients": "[\"+91xxxxxxxx\",\"+91xxxxxxxx\"]","message": "This is a test"}]}`;
var parsed = JSON.parse(data);
console.log(parsed);
Note however, that the JSON you posted at the start of your question is valid.
On the other hand, the error you get indicates that the \" just before the first + is interpreted as just ". This means the \ is not actually there when the string is received from the server. This is usually caused by a similar escaping problem at the server side, where the programmer intended to send the backslash to the client, but actually just escaped the " on the server, which resulted in only the " being sent to the client and not \".

You have to use single quotes here while escape sequence.
if we use double quotes for escape sequence here it will result in
"recipients": "["+91xxxxxxxx","+91xxxxxxxx"]"
double quotes inside double quotes which is why your code breaks.
data = '{"triggers": [{"message_type": "sms","recipients": "[\'+91xxxxxxxx\',\'+91xxxxxxxx\']","message": "This is a test"}]}';
parsed = JSON.parse(data);
console.log(parsed)

Related

How can I resolve JSON parsing error 'JSON.parse: bad control character in string literal'?

In NodeJS Backend, I send my data to client as:-
res.end(filex.replace("<userdata>", JSON.stringify({name:user.name, uid:user._id, profile:user.profile}) ))
//No error here and Object is stringified perfectly
//user is object returned in mongoDB's result
The JSON string looks like this:
{"name":"Rishavolva","uid":"5f3ce234fd83024334050872","profile":{"pic":{"small_link":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyZXBsaWNhcyI6MiwidXJpcyI6W3siZGJfbmFtZSI6ImlmcmRiMDAxIiwidGFibGUiOiJGSUxFIiwiaWQiOjQ4fSx7ImRiX25hbWUiOiJpZnJkYjAwMiIsInRhYmxlIjoiRklMRSIsImlkIjo0OH1dLCJ1aWRfd2hpdGVsaXN0IjoiKiIsImlhdCI6MTU5ODE2MzMzNX0.9NkGnEumn4JW8IN0KFgxgN_6_4wN8qOgezNTyzz9osY","big_link":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyZXBsaWNhcyI6MiwidXJpcyI6W3siZGJfbmFtZSI6ImlmcmRiMDAxIiwidGFibGUiOiJGSUxFIiwiaWQiOjQ3fSx7ImRiX25hbWUiOiJpZnJkYjAwMiIsInRhYmxlIjoiRklMRSIsImlkIjo0N31dLCJ1aWRfd2hpdGVsaXN0IjoiKiIsImlhdCI6MTU5ODE2MzMzNX0.yxQ1GrhLsWPn8Qwu42EfTDXqaYwFtrM6f_7cAH2eLRY"},"aboutme":"I am Rishav Bhowmik\r\nand this is navratna pulaow"}}
and that UID is just a mongodb's primary key as string, and other two base 64 strings are just JWT tokens.
Now, when this JSON string reaches the Browser, I parse it with simple:
JSON.parse(`<userdata>`)
//remember I used filex.replace("<userdata>", JSON.stringify...) in the server
For reference, my MongoDB Document here is:
Now when JSON.parse is executed on the JSON string it will look like this on final JS code.
JSON.parse(`{"name":"Rishavolva","uid":"5f3ce234fd83024334050872","profile":{"pic":{"small_link":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyZXBsaWNhcyI6MiwidXJpcyI6W3siZGJfbmFtZSI6ImlmcmRiMDAxIiwidGFibGUiOiJGSUxFIiwiaWQiOjQ4fSx7ImRiX25hbWUiOiJpZnJkYjAwMiIsInRhYmxlIjoiRklMRSIsImlkIjo0OH1dLCJ1aWRfd2hpdGVsaXN0IjoiKiIsImlhdCI6MTU5ODE2MzMzNX0.9NkGnEumn4JW8IN0KFgxgN_6_4wN8qOgezNTyzz9osY","big_link":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyZXBsaWNhcyI6MiwidXJpcyI6W3siZGJfbmFtZSI6ImlmcmRiMDAxIiwidGFibGUiOiJGSUxFIiwiaWQiOjQ3fSx7ImRiX25hbWUiOiJpZnJkYjAwMiIsInRhYmxlIjoiRklMRSIsImlkIjo0N31dLCJ1aWRfd2hpdGVsaXN0IjoiKiIsImlhdCI6MTU5ODE2MzMzNX0.yxQ1GrhLsWPn8Qwu42EfTDXqaYwFtrM6f_7cAH2eLRY"},"aboutme":"I am Rishav Bhowmik\r\nand this is navratna pulaow"}}`)
I get this error:
Uncaught SyntaxError: JSON.parse: bad control character in string literal at line 1 column 702 of the JSON data
the string at position 702 of the JSON string is \n
First of all, how can \n be a control character?
What should I do to resolve this?
Has this problem arrised due to MONGODB result?
\n is a control character signifying a new line. In JSON, those control characters (more specifically the \) must be escaped inside strings.
This will raise the error:
JSON.parse(`{"hello":"world\n"}`)
This wont:
JSON.parse(`{"hello":"world\\n"}`)
So one way would be to use something like replace to ensure your aboutme is properly escaped before JSON serialization. See: How to escape a JSON string containing newline characters using JavaScript?
Ok have done some experimentation and have a solution.
The Trick is to do JSON.stringify() twice,
Like,
html_text.replace('/*<whatever>*/', JSON.stringify( JSON.stringify(the_object) ) )
If suppose html_text has a line which is
<script>
const object_inbrowser = JSON.parse(/*<whatever>*/)
// no need to add qotes, `JSON.stringify` in the server will do that for you
</script>

browser appends escape \ character to javascript object

I am trying to send an MQTT message to topic from angular app which accepts the message in a specific syntax as follows
{
"Message": "hello" //the space after : is mandatory
}
but after I send the message in the above format the browser appends \ to the above code as follows
"{ \"Message\" : \"hello\" }"
which disrupts the actual syntax and the message is not accepted by the topic (receiver).
How can I fix this?
but once I hit send the browser appends \ to the above code as follows
What do you mean by "hit send in browser"? How are you sending the MQTT message? Since you seem to be sending a JSON, have you tried to somehow add the following header to the request sending the object:
'Content-Type': 'application/json'
As to why your code sample returns an Array, that is because your str variable is actually an Array with a single string element. The correct way of parsing your string to a json object would be as follows:
var str ="{\"message\": \"hello\"}"
console.log(str)
console.log(JSON.parse(str))
Notice the lack of square brackets [] (thus a string and not an array). Also, since str is no longer an array, it no longer has a map method, so we just directly call JSON.parse on it.
Note that you could also use single quotes instead of double quotes when declaring strings in javascript, so you could also declare str as follows:
var str ='{"message": "hello"}'
This way you don't need to escape your quotes with backslashes.

Unexpected Token in string version of valid JSON while performing JSON.parse

I am having problem converting a JSON String into Javascript object.
I ran into a few suggestions which said that I should not be using multi-line string but using single line string too did not work.
Snippet: https://jsfiddle.net/ankschoubey/hjh2d3z6/
SyntaxError: Unexpected token F in JSON at position 4536
Because you're including JSON as a JavaScript string value, you'll have to double-up on all the embedded backslash characters because they'll be parsed twice: first when the JavaScript parser reads the overall string constant to create the string value, and then again when you call JSON.parse().
Thus that portion of the string with \" should be \\". That way, the JavaScript string parsing will turn \\" into just \", and that's what will make the JSON parser happy.

Parsing string as JSON with single quotes on key and keyvalue [duplicate]

This question already has answers here:
Parsing string as JSON with single quotes?
(10 answers)
Closed 1 year ago.
var str = "{'a':'Your's'}";
JSON.parse(str);
My server response like above string. Not able to parse as JSON. It is as example text. While am parsing I got error as below:
JSON.parse(str);
VM1951:1 Uncaught SyntaxError: Unexpected token ' in JSON at position 1(…)(anonymous function) # VM1950:1
The same question already raised by someone. click here to see. But, not helpful. Please help on this. Thanks in advance.
TL;DR JSON only supports double quotes.
Please fix the error on the server, if this is possible.
JSON required double quotes, the single quotes are therefore not conform to the standard. There may be parsers, that support them anyway, but you can never rely on that. For more details on the JSON syntax, you may have a look at http://www.json.org/.
Besides this, the input string "{'a':'Your's'}"; is totally invalid itself, if the single quotes would be valid. The ' in Your's is breaking the string literal, the following s is outside the string and the next ' is opening a string, that contains } but is never closed by another '.
The correct syntax would be '{"a":"Your\'s"}'.
If you received the string and cannot correct the server output, you may try to replace all ' by ", but you will have problems with single quotes inside your payload strings. By far the easiest - and most stable(!) - fix should be correcting the server output instead of correcting the defect output on the client.
Converting on the client with the following code may be a good idea at the first thought, but would corrupt payload strings with single quotes in it.
replaceInString = function(fullString, search, replacement) {
return fullString.split(search).join(replacement);
};
var json = replaceInString("{'a':'Your's'}", "'", '"');
If you can be sure, there are no whitespace characters outside the payload and also there are no line breaks, you could use the following function. But also only, if you are sure, the search patterns are not in the payload strings.
var json = "{'a':'Your's'}";
replaceInString = function(fullString, search, replacement) {
return fullString.split(search).join(replacement);
};
json = replaceInString(json, "{'", '{"');
json = replaceInString(json, "'}", '"}');
json = replaceInString(json, "':", '":');
json = replaceInString(json, ":'", ':"');
json = replaceInString(json, "',", '",');
json = replaceInString(json, ",'", ',"');
json = replaceInString(json, "['", '["');
json = replaceInString(json, "']", '"]');
But using this code, e.g. the JSON `following JSON string would be corrupted.
{'mathTerm':'x=1-[2+A']'}
To be clear: Code like this gets you over a bump on the road to develop , test or learn something. But this is not a durable fix. Contact the server developer to fix his implementation and remove your client side fix before going to production.
JSON keys and values must be enclosed in double quotes (") instead of single quotes (')
This is correct:
var str = '{"a":"Your\'s"}';
JSON.parse(str);

javascript eval json with base64 encoded field

I am using sun.misc.BASE64Encoder to encode an encrypted value, which is then added to a JSON field and subsequently sent to the client. I use Javascript's eval() function on the client to create an object from the JSON code. When eval() runs, it gives the error:
unterminated string literal
There are other fields in the JSON code, but I've narrowed the error specifically to the base64 encoded field. Here's the offending line of javascript code:
var result = eval( '(' + xhr.responseText + ')' );
Here's the JSON object from the Servlet:
{
'resource':'resource?Signature=j79r/2Hly+HqhS/6fdd+prfsR+kUNijUvDN0QJ14ZR43gzYScOMDypt/crks/CEphTUXVptJvSol
1ZOOvScCUhNOCb7dZk/3MKnI5tOewSACXK32/OJNd8hYpZtSTn+WhA6+f9BUIUZWA83U8Cud/Tb8V
R1yQWbDGG/mM/NiUSiY=',
'url':'http://somesite.com/pr'
}
I'm not sure why eval is dying, but it seems the value of the 'resource' JSON field contains something it doesn't care for.
Thanks in advance.
Tim
I think it may be because your JSON appears to have line breaks in it. If you remove them, does it work?

Categories