Wie man doppelte Anführungszeichen in JSON escapen

Question

Ich versuche, doppelte Anführungszeichen anzuzeigen, aber es zeigt eine der Backslashes:

"maingame": {
    "day1": {
        "text1": "Tag 1",
        "text2": "Heute startet unsere Rundreise \\\"Beispieltext\\\". Jeden Tag wird ein neues Reiseziel angesteuert bis wir. "
    }
}

Beim Rendern im HTML wird es als \"Beispieltext\" angezeigt. Was ist der richtige Weg?

Answer 1

Tl;dr

Wenn Sie sich im inneren JavaScript/Python/etc. befinden, verwenden Sie Raw-Strings (python's r'' oder JavaScript's String.raw oder ähnliches). Damit wird es viel einfacher, JSON-Strings zu schreiben, da mehrfache Escape-Sequenz-Verarbeitungen vermieden werden.

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

---

Weiterführende Informationen

Einige Verwirrung beim Schreiben von JSON-Strings im Code entsteht durch die mehrfache Verarbeitung von Zeichenketten-Escape-Sequenzen. Einmal in der Programmiersprache, erneut im JSON-Parser (z. B. JSON.parse() in JavaScript oder ähnliches).

Verwenden Sie die Druckfunktion der Sprache, um zu sehen, welche Escapes in der Programmiersprache passieren

Es kann verwirrend sein, wie Zeichenketten in einer Programmiersprach-Replikation angezeigt werden.

Beispielsweise, wenn Sie eine Zeichenkette direkt in eine JavaScript-Replikation eingeben, wird sie so angezeigt

'Zwei Zeilenumbrüche:\n\nTab hier >>\t<<\n\nBackslash hier >>\\<<'
// => 'Zwei Zeilenumbrüche:\n\nTab hier >>\t<<\n\nBackslash hier >>\\<<'

Aber wenn Sie die Zeichenkette console.log(), wird sie so angezeigt

console.log('Zwei Zeilenumbrüche:\n\nTab hier >>\t<<\n\nBackslash hier >>\\<<')
/* =>
Zwei Zeilenumbrüche:

Tab hier >> <<

Backslash hier >>\<<
*/

Wenn JavaScript auf eine Zeichenkette trifft, 'bewertet' es die Escape-Sequenzen, bevor es sie z. B. an eine Funktion übergibt, im Sinne dass es jedes \n durch ein Zeilenumbruchszeichen, jedes \t durch ein Tab-Zeichen usw. ersetzt.

Also hilft es sehr, die Zeichenkette mit console.log() zu überprüfen, um eine bessere Vorstellung davon zu bekommen, was passiert.

Wie man einfaches Anführungszeichen in JSON in JavaScript kodiert

Um in JavaScript eine " in JSON zu schreiben, könnten Sie

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

Es wäre ähnlich in Python und anderen Sprachen.

Schritt für Schritt:

1. JavaScript bewertet die Zeichenkette unter Verwendung der Escape-Sequenz-Regeln aus der JavaScript-Spezifikation, ersetzt \n durch ein Zeilenumbruchszeichen, \t durch ein Tab-Zeichen usw.
   • In unserem Fall ersetzt es \\ durch \.
   • Die Ergebniszeichenfolge ist "This is a double quote >> \" <<"
   • Wir setzen die äußeren doppelten Anführungszeichen, um daraus eine gültige JSON-Zeichenfolge zu machen
2. JavaScript nimmt das Ergebnis und übergibt es der JSON.parse() fn.
3. JSON.parse bewertet die Zeichenkette unter Verwendung der Escape-Sequenz-Regeln aus dem JSON-Standard, ersetzt \n durch ein Zeilenumbruchszeichen, \t durch ein Tab-Zeichen usw. In unserem Fall,
   • das erste Zeichen, das es sieht, ist ", also weiß es, dass dies eine JSON-Zeichenkette ist.
   • In der JSON-Zeichenkette sieht es \". Normalerweise würde " das Ende der JSON-Zeichenkette markieren, aber da " mit \ escapet ist, weiß es, dass dies nicht das Ende der Zeichenkette ist und ersetzt \" durch ein wörtliches doppeltes Anführungszeichen.
   • das letzte Zeichen, das es sieht, ist ", also weiß es, dass dies das Ende der JSON-Zeichenkette ist
   • Die analysierte Ergebniszeichenfolge ist Das ist ein doppeltes Anführungszeichen >> " <<. Beachten Sie, dass auch die äußeren doppelten Anführungszeichen verschwunden sind.

Raw-Strings machen es einfacher

Die Raw-String-Vorlagenfunktion von JavaScript String.raw und die Raw-Strings von Python r'' evaluieren keine Escape-Sequenzen, was es viel einfacher und weniger verwirrend macht, darüber nachzudenken

console.log(JSON.parse(String.raw`"Das ist ein doppeltes Anführungszeichen >> \" <<"`))
// => This is a double quote >> " <<

Answer 2

Um den Problemen mit Backslashes zu entkommen, die JSON-Daten verursachen können, verwende ich diese Funktion.

// Backslash escapen, um Fehler zu vermeiden
var escapeJSON = function(str) {
    return str.replace(/\\/g,'\\');
};

Answer 3

Für diejenigen, die den Entwickler-PowerShell nutzen möchten. Hier sind die Zeilen, die Sie zu Ihrer settings.json hinzufügen müssen:

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