I'm using Editor.js (which saves the HTML blocks as JSON) to create content on my website and it works great unless there is a " in the JSON value.

Data insertion works correctly, but when editing entries containing escaped double quotes (\") within JSON values, JavaScript's JSON.parse fails. For example:

j = JSON.parse(`{"data": "<a href=\"/\">Google</a>"}`);

The above would not parse and will say:

SyntaxError: JSON Parse error: Expected '}'

I've tried with just single quotes and that doesn't work either. I've checked if the JSON is valid and jsonlint says both the JSON I generated with Editor.js is valid and the JSON above is valid.

What am I doing wrong? Again, everything works if as long as I don't have an escaped quote (") in the JSON.

I'm using Editor.js (which saves the HTML blocks as JSON) to create content on my website and it works great unless there is a " in the JSON value.

Data insertion works correctly, but when editing entries containing escaped double quotes (\") within JSON values, JavaScript's JSON.parse fails. For example:

j = JSON.parse(`{"data": "<a href=\"https://www.google/\">Google</a>"}`);

The above would not parse and will say:

SyntaxError: JSON Parse error: Expected '}'

I've tried with just single quotes and that doesn't work either. I've checked if the JSON is valid and jsonlint says both the JSON I generated with Editor.js is valid and the JSON above is valid.

What am I doing wrong? Again, everything works if as long as I don't have an escaped quote (") in the JSON.

• javascript
• json
• quotes

1 Answer 1

Escape sequences are still parsed in template literals. \" will not behave differently just because it isn't surrounded by double quotes.

Thus, \" in a template literal becomes ", which yields:

{"data": "<a href="https://www.google/">Google</a>"}

Which is not valid JSON. You have to escape the backslashes too. Use \\".

console.log(JSON.parse(`{"data": "<a href=\\"https://www.google/\\">Google</a>"}`));