JSON schön formatieren (Alle Methoden)

Das schöne Formatieren (Pretty Printing) von JSON macht Rohdaten durch korrekte Einrückungen und Zeilenumbrüche lesbar. Dies ist unerlässlich für das Debugging, die Dokumentation, die API-Entwicklung und alle Szenarien, in denen Menschen strukturierte Daten inspizieren müssen. Ohne schöne Formatierung erscheint JSON als einzelne, ununterbrochene Textzeile, die visuell kaum zu erfassen ist. Dieser Leitfaden behandelt jede Methode zum Formatieren von JSON in verschiedenen Umgebungen, von Online-Tools über Kommandozeilen-Dienstprogramme bis hin zu Code-Bibliotheken.

Was ist schöne Formatierung?

Schöne Formatierung (auch Beautifying oder Formatieren genannt) nimmt kompaktes JSON und fügt Leerzeichen hinzu, um es für Menschen lesbar zu machen. Ein kompaktes JSON-Objekt wie {"name":"John","age":30,"hobbies":["reading","coding"]} wird zu einer strukturierten, eingerückten Darstellung:

{
  "name": "John",
  "age": 30,
  "hobbies": [
    "reading",
    "coding"
  ]
}

Der Prozess ändert die Daten nicht – nur ihre visuelle Darstellung. Die meisten Formatierungswerkzeuge bieten konfigurierbare Einrückungen (2 Leerzeichen, 4 Leerzeichen oder Tabs) und optionale Sortierung der Schlüssel. Einige bieten auch Syntax-Highlighting, einklappbare Baumansichten und Fehlerhervorhebung für ungültiges JSON.

Online-Methode

Der Help2Code JSON-Formatierer bietet sofortige Formatierung mit Syntax-Highlighting, Validierung und einer Baumansicht. Es ist der schnellste Weg, JSON zu formatieren, ohne Software installieren zu müssen. Fügen Sie einfach Ihren JSON-String in das Eingabefeld ein, und das Tool formatiert ihn in Echtzeit. Zu den wichtigsten Funktionen gehören:

• Echtzeit-Formatierung während der Eingabe oder beim Einfügen
• Syntax-Highlighting für Schlüssel, Zeichenketten, Zahlen, Booleans und Null-Werte
• JSON-Validierung mit zeilenspezifischen Fehlermeldungen
• Einklappbare Baumansicht zur Navigation durch tief verschachtelte Strukturen
• Herunterladen der formatierten Ausgabe als Datei
• Minifizierungsmodus zum Zurückkomprimieren von formatiertem JSON in die kompakte Form
• In die Zwischenablage kopieren mit einem Klick

Dieses Tool ist ideal für Entwickler, die schnell API-Antworten inspizieren, Konfigurationsdateien debuggen oder formatiertes JSON mit Kollegen teilen müssen.

Methodenvergleich

Browser DevTools

Alle modernen Browser enthalten eine integrierte JSON-schön-Formatierung in ihren Entwicklertools. Wenn Sie Objekte mit console.log() in der Konsole ausgeben, zeigt der Browser sie automatisch in einer einklappbaren, interaktiven Baumansicht an. Für mehr Kontrolle über die Formatierung verwenden Sie JSON.stringify() mit Formatierungsoptionen:

const data = {
  name: "John",
  age: 30,
  hobbies: ["reading", "coding"],
  address: { street: "123 Main St", city: "Boston", zip: "02101" }
};

console.log(JSON.stringify(data, null, 2));
console.log(JSON.stringify(data, null, 4));
console.log(JSON.stringify(data, null, '\t'));

const users = [
  { id: 1, name: "Alice", role: "Admin" },
  { id: 2, name: "Bob", role: "User" }
];
console.table(users);

VS Code

Visual Studio Code bietet hervorragende JSON-Bearbeitungs- und Formatierungsunterstützung direkt aus der Box:

1. Dokument formatieren: Markieren Sie JSON-Inhalt und drücken Sie Shift+Alt+F (Windows/Linux) oder Shift+Option+F (Mac), oder klicken Sie mit der rechten Maustaste und wählen Sie "Dokument formatieren".
2. Auto-Formatieren beim Speichern: Fügen Sie "editor.formatOnSave": true zu Ihrer settings.json hinzu, um JSON-Dateien beim Speichern automatisch zu formatieren.
3. JSON mit Kommentaren (.jsonc): VS Code unterstützt JSON-Dateien, die Kommentare enthalten, die häufig für Konfigurationsdateien wie settings.json und launch.json verwendet werden.

Kommandozeile (jq)

echo '{"name":"test","value":123}' | jq .
echo '{"name":"test"}' | jq -C .
jq . file.json
jq . file.json > formatted.json
jq --indent 4 . file.json
jq -c . file.json
jq -S . file.json
cat data.json | jq '.users' | jq .
cat messy.json | jq -C . | less -R
curl https://api.example.com/users | jq .
curl https://api.example.com/users | jq '.[:5]'
cat data.json | jq '{name: .user.name, email: .user.email}'

Sprachspezifische Methoden

JavaScript:

const pretty = JSON.stringify(obj, null, 2);
const compact = JSON.stringify(obj);
const filtered = JSON.stringify(obj, ['name', 'age'], 2);
const redacted = JSON.stringify(obj, (key, value) => {
  if (key === 'password' || key === 'ssn') return '***';
  return value;
}, 2);

Python:

import json
data = {"name": "John", "age": 30, "active": True}
pretty = json.dumps(data, indent=2)
pretty = json.dumps(data, indent=2, sort_keys=True)
pretty = json.dumps(data, indent=2, ensure_ascii=False)
compact = json.dumps(data, separators=(',', ':'))
print(json.dumps(data, indent=2, sort_keys=True))

PHP:

$data = ["name" => "John", "age" => 30, "hobbies" => ["reading"]];
$pretty = json_encode($data, JSON_PRETTY_PRINT);
$pretty = json_encode($data, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE);
$pretty = json_encode($data, JSON_PRETTY_PRINT | JSON_SORT_KEYS);
$pretty = json_encode($data, JSON_PRETTY_PRINT | JSON_HEX_TAG | JSON_HEX_AMP);

Ruby:

require 'json'
data = { name: "John", age: 30, active: true }
puts JSON.pretty_generate(data)
puts JSON.pretty_generate(data, indent: "    ")

Go:

package main
import (
    "encoding/json"
    "fmt"
)
func main() {
    data := map[string]interface{}{"name": "John", "age": 30}
    pretty, _ := json.MarshalIndent(data, "", "  ")
    fmt.Println(string(pretty))
}

Wann welche Methode verwendet werden sollte

• Einmalige Formatierung: Online-Tool (am schnellsten, keine Installation)
• Während der Entwicklung: Browser DevTools oder VS Code
• In Skripten und Automatisierung: jq (pipeline-freundlich, skriptbar)
• Programmatische Formatierung: Sprachspezifische Methoden
• Große Dateien: jq oder Kommandozeilen-Tools (speichereffizient)