How to escape double quotes in JSON

Json

Json Problem Overview


I'm trying to show double quotes but it shows one of the backslashes:

"maingame": {
    "day1": {
        "text1": "Tag 1",
        "text2": "Heute startet unsere Rundreise \\\"Example text\\\". Jeden Tag wird ein neues Reiseziel angesteuert bis wir.</strong> "
    }
}

When rendering in the html it shows as \"Example text\". What is the correct way?

Json Solutions


Solution 1 - Json

Try this:

"maingame": {
  "day1": {
    "text1": "Tag 1",
     "text2": "Heute startet unsere Rundreise \" Example text\". Jeden Tag wird ein neues Reiseziel angesteuert bis wir.</strong> "
  }
}

(just one backslash (\) in front of quotes).

Solution 2 - Json

When and where to use \\\" instead. OK if you are like me you will feel just as silly as I did when I realized what I was doing after I found this thread.

If you're making a .json text file/stream and importing the data from there then the main stream answer of just one backslash before the double quotes:\" is the one you're looking for.

However if you're like me and you're trying to get the w3schools.com "Tryit Editor" to have a double quotes in the output of the JSON.parse(text), then the one you're looking for is the triple backslash double quotes \\\". This is because you're building your text string within an HTML <script> block, and the first double backslash inserts a single backslash into the string variable then the following backslash double quote inserts the double quote into the string so that the resulting script string contains the \" from the standard answer and the JSON parser will parse this as just the double quotes.

<script>
  var text="{";
  text += '"quip":"\\\"If nobody is listening, then you\'re likely talking to the wrong audience.\\\""';
  text += "}";
  var obj=JSON.parse(text);
</script>

+1: since it's a JavaScript text string, a double backslash double quote \\" would work too; because the double quote does not need escaped within a single quoted string eg '\"' and '"' result in the same JS string.

Solution 3 - Json

It's showing the backslash because you're also escaping the backslash.

Aside from double quotes, you must also escape backslashes if you want to include one in your JSON quoted string. However if you intend to use a backslash in an escape sequence, obviously you shouldn't escape it.

Solution 4 - Json

if you want to escape double quote in JSON use \\ to escape it.

example if you want to create json of following javascript object

{time: '7 "o" clock'}

then you must write in following way

'{"time":"7 \\"o\\" clock"}'

if we parse it using JSON.parse()

JSON.parse('{"time":"7 \\"o\\" clock"}')

result will be

{time: "7 "o" clock"}

Solution 5 - Json

Note that this most often occurs when the content has been "double encoded", meaning the encoding algorithm has accidentally been called twice.

The first call would encode the "text2" value:

FROM: Heute startet unsere Rundreise "Example text". Jeden Tag wird ein neues Reiseziel angesteuert bis wir.

TO: Heute startet unsere Rundreise \"Example text\". Jeden Tag wird ein neues Reiseziel angesteuert bis wir.

A second encoding then converts it again, escaping the already escaped characters:

FROM: Heute startet unsere Rundreise \"Example text\". Jeden Tag wird ein neues Reiseziel angesteuert bis wir.

TO: Heute startet unsere Rundreise \\\"Example text\\\". Jeden Tag wird ein neues Reiseziel angesteuert bis wir.

So, if you are responsible for the implementation of the server here, check to make sure there aren't two steps trying to encode the same content.

Solution 6 - Json

To escape backslashes that cause problems for JSON data I use this function.

//escape backslash to avoid errors
var escapeJSON = function(str) {
    return str.replace(/\\/g,'\\');
};

Solution 7 - Json

For those who would like to use developer powershell. Here are the lines to add to your settings.json:

"terminal.integrated.automationShell.windows": "C:\\Windows\\SysWOW64\\WindowsPowerShell\\v1.0\\powershell.exe",
"terminal.integrated.shellArgs.windows": [
    "-noe",
    "-c",
    " &{Import-Module 'C:\\Program Files (x86)\\Microsoft Visual Studio\\2019\\BuildTools\\Common7\\Tools\\Microsoft.VisualStudio.DevShell.dll'; Enter-VsDevShell b7c50c8d} ",
    ],

Solution 8 - Json

tl;dr

If your inside javascript/python/etc., use raw strings (python's r'' or javascript's String.raw or similar). They make it much easier to write JSON strings because they avoid multiple escape sequence processing.

console.log(JSON.parse(String.raw`"This is a double quote >> \" <<"`))
// => This is a double quote >> " <<

More in depth

Some confusion when writing JSON strings in code comes from string escape sequences being processed multiple times. One time in the programming language, again in the JSON parser (e.g. JSON.parse() in Javascript, or similar)

Use the language's print function to see what escapes are happening in the programming language

It can be confusing to see how strings are displayed in a programming language repl.

E.g. when you type a string directly into a javascript repl, it displays it this way

'Two newlines:\n\nTab here >>\t<<\n\nBackslash here >>\\<<'
// => 'Two newlines:\n\nTab here >>\t<<\n\nBackslash here >>\\<<'

But when you console.log() the string, it displays it this way

console.log('Two newlines:\n\nTab here >>\t<<\n\nBackslash here >>\\<<')
/* =>
Two newlines:

Tab here >>	<<

Backslash here >>\<<
*/

When javascript encounters a string, it 'evaluates' the escape sequences before passing it e.g. to a function, in the sense that it replaces each \n with a newline character, each \t with a tab character, etc.

So it helps a lot to console.log() the string to get a better idea of what's going on.

How to encode a single quote in JSON in javascript

To write a " to a JSON in javascript, you could use

console.log(JSON.parse('"This is a double quote >> \\" <<"'));
// => This is a double quote >> " <<

It'd be similar in python and other languages.

Step by step:
  1. javascript evaluates the string using escape sequence rules from the javascript spec, replacing \n with a newline char, \t with a tab char, etc.
    • In our case, it replaces \\ with \.
    • The result string is "This is a double quote >> \" <<"
    • We put the outer double quotes to make it a valid JSON string
  2. javascript takes the result and passes it to the JSON.parse() fn.
  3. JSON.parse evaluates the string using escape sequence rules from the JSON standard, replacing \n with a newline char, \t with a tab char, etc. In our case,
    • the first character it sees is ", so it knows this is a JSON string.
    • Inside the JSON string, it sees \". Normally " would end the JSON string, but because " is escaped with \, it knows this isn't the end of the string and to replace \" with a literal double quote character.
    • the last character it sees is ", so it knows this is the end of the JSON string
    • The result parsed string is This is a double quote >> " <<. Note the outer double quotes are gone also.

Raw strings make things easier

Javascript's String.raw template function and python's r'' strings don't do any escape sequence evaluating, so it makes it much easier and less confusing to reason about

console.log(JSON.parse(String.raw`"This is a double quote >> \" <<"`))
// => This is a double quote >> " <<

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Questionuser1937021View Question on Stackoverflow
Solution 1 - JsonkamituelView Answer on Stackoverflow
Solution 2 - JsonGregor yView Answer on Stackoverflow
Solution 3 - JsonAlex WordenView Answer on Stackoverflow
Solution 4 - JsonmanasView Answer on Stackoverflow
Solution 5 - JsonBenView Answer on Stackoverflow
Solution 6 - JsonmbokilView Answer on Stackoverflow
Solution 7 - JsonerikeahView Answer on Stackoverflow
Solution 8 - Jsonmatt0089View Answer on Stackoverflow