简体   繁体   中英

How to escape double quotes in JSON

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?

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).

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.

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.

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"}

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.

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 (eg 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.

Eg 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 eg 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 >> " <<

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,'\\');
};

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} ",
    ],

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM