JSON Formatter: Verschönern & Validieren

Was ist JSON Formatter?

JSON Formatter ist ein browserbasiertes Werkzeug, das rohen oder fehlerhaften JSON-Text in Sekunden in sauber eingerückten, lesbaren Output verwandelt. Entwickler begegnen unlesbarem JSON ständig – von API-Antworten, die in eine einzige Zeile komprimiert wurden, über kopierte Konfigurationsfragmente, die ihre Leerzeichen verloren haben, bis hin zu manuell bearbeiteten Dateien mit subtilen Syntaxfehlern. Dieses Werkzeug löst alle drei Probleme gleichzeitig: Es formatiert mit konfigurierbarer Einrückung, validiert die Syntax und repariert häufige Fehler automatisch mithilfe der jsonrepair-Bibliothek.

Im Gegensatz zu serverseitigen Alternativen läuft der JSON Formatter vollständig in Ihrem Browser. Ihre Daten verlassen Ihren Computer nicht. Es gibt kein Konto, kein Ratenlimit und keine Kosten.

Hauptfunktionen

• Formatieren mit anpassbarer Einrückung (2 oder 4 Leerzeichen) — Wählen Sie Ihre bevorzugte Einrückungsgröße aus dem Dropdown-Menü der Aktionsleiste, bevor Sie auf „Formatieren" klicken. Die Auswahl bleibt zwischen Sitzungen erhalten, wenn sie mit dem Speichern von Voreinstellungen kombiniert wird.
• JSON-Syntax mit Fehlermeldungen validieren — Das Werkzeug führt JSON.parse nach einem automatischen Reparaturversuch aus und zeigt die genaue Fehlermeldung an, wenn die Eingabe nicht geparst werden kann. Diese wird im Ausgabebereich mit einem barrierefreien role="alert"-Attribut angezeigt.
• Fehlerhaftes JSON automatisch reparieren — Die jsonrepair-Bibliothek korrigiert einfach angeführte Zeichenketten, nachgestellte Kommas, nicht angeführte Schlüssel und andere häufige Abweichungen vor dem Parsen. Wenn eine Reparatur angewendet wird, informiert eine deutliche Toast-Benachrichtigung Sie darüber.
• JSON minimieren (Leerzeichen entfernen) — Erzeugt eine einzeilige Ausgabe, aus der alle Formatierungs-Leerzeichen entfernt wurden; nützlich zum Einbetten von JSON in Konfigurationsdateien oder zum Reduzieren der Payload-Größe.
• Formatierte Ausgabe in die Zwischenablage kopieren — Ein-Klick-Kopieren über die Clipboard API mit einem Fallback für ältere Browser.
• Als .json-Datei herunterladen — Speichert die Ausgabe als formatted.json mit dem MIME-Typ application/json.
• Tab „Schema-Validator" — Fügen Sie JSON-Daten und ein JSON-Schema-Dokument (Draft-07) ein; das Werkzeug meldet jeden Verstoß mit seinem genauen Pfad (z. B. root.user.email).
• Tab „Schema-Generator" — Fügen Sie ein beliebiges JSON-Objekt ein; das Werkzeug leitet ein JSON-Schema-Dokument (Draft-07) ab, einschließlich erkannter Formate (E-Mail, Datum, UUID, URI).
• Tab „Baumansicht" — Rendert das geparste JSON als interaktiven, einklappbaren Baum mit farbcodierten Typen, Suchhervorhebung, „Alle aufklappen/zuklappen" und Ein-Klick-Pfadkopieren.

So verwenden Sie JSON Formatter

Schritt 1: JSON einfügen

Öffnen Sie den Tab „Formatieren/Minimieren" (die Standardansicht). Fügen Sie Ihr JSON in das Eingabefeld auf der linken Seite ein. Das Textfeld nimmt Eingaben beliebiger Größe an und kann durch Ziehen des unteren Randes vertikal vergrößert werden. Wenn Sie einen freigegebenen Link von einem Kollegen laden, liest das Werkzeug die Eingabe automatisch aus der URL und zeigt eine Toast-Benachrichtigung an.

Schritt 2: Einrückung wählen

Öffnen Sie in der Aktionsleiste unterhalb der Panels das Einrückungs-Dropdown. Wählen Sie entweder 2 Leerzeichen (Standard) oder 4 Leerzeichen. Dies steuert, wie viele Leerzeichen pro Verschachtelungsebene in der Ausgabe verwendet werden. Eine 4-Leerzeichen-Einrückung ist in Python-Projekten und einigen Stilrichtlinien üblich; 2 Leerzeichen sind Standard in JavaScript- und Node.js-Ökosystemen.

Schritt 3: „Formatieren" klicken

Klicken Sie auf die Schaltfläche Formatieren oder drücken Sie Cmd+Enter (Mac) / Ctrl+Enter (Windows/Linux). Das formatierte JSON erscheint im schreibgeschützten Ausgabepanel auf der rechten Seite. Wenn die Eingabe behebbare Probleme enthält – wie nachgestellte Kommas oder nicht angeführte Schlüssel – liest eine Toast-Benachrichtigung „JSON formatted and repaired", um zu bestätigen, dass die Reparatur angewendet wurde. Wenn das JSON nicht reparierbar ist, erscheint eine Fehlermeldung unterhalb des Ausgabepanels mit dem spezifischen Parse-Fehler.

Beispieleingabe (komprimierte API-Antwort):

{"user":{"id":4821,"name":"Maria Santos","email":"maria@example.com","roles":["admin","editor"],"active":true,"lastLogin":null}}

Ausgabe mit 2-Leerzeichen-Einrückung:

{
  "user": {
    "id": 4821,
    "name": "Maria Santos",
    "email": "maria@example.com",
    "roles": [
      "admin",
      "editor"
    ],
    "active": true,
    "lastLogin": null
  }
}

Schritt 4: Minimieren (optional)

Um das JSON wieder auf eine einzige Zeile zu reduzieren, klicken Sie auf Minimieren oder drücken Sie Cmd+Shift+M / Ctrl+Shift+M. Dies ist nützlich, wenn Sie formatiertes JSON haben, das in eine Umgebungsvariable oder einen Konfigurationsstring eingebettet werden muss.

Schritt 5: Ausgabe kopieren oder herunterladen

Klicken Sie auf Kopieren, um die Ausgabe in Ihre Zwischenablage zu legen. Klicken Sie auf Herunterladen, um formatted.json in Ihren Downloads-Ordner zu speichern. Die Schaltfläche „Kopieren" ist deaktiviert, bis eine Ausgabe vorhanden ist, um versehentliche leere Zwischenablage-Operationen zu verhindern.

Den Schema-Validator verwenden

Wechseln Sie zum Tab Schema-Validator. Fügen Sie Ihre JSON-Daten im linken Panel und ein JSON-Schema-Dokument im rechten Panel ein, dann klicken Sie auf Validieren. Die Ergebnisse erscheinen darunter mit einem grünen Häkchen für gültige Daten oder einer roten Liste von Verstößen. Jeder Verstoß zeigt seinen Punkt-Notations-Pfad (z. B. root.addresses[0].postalCode) und eine klare Beschreibung des Fehlers (z. B. „String entspricht nicht dem Muster: ^\\d{5}$").

Den Schema-Generator verwenden

Wechseln Sie zum Tab Schema-Generator. Fügen Sie ein JSON-Beispielobjekt ein und klicken Sie auf Schema generieren. Das Werkzeug erstellt in Sekunden ein JSON-Schema-Dokument (Draft-07), das aus dem Beispiel abgeleitet wurde, einschließlich Formathinweise für Zeichenketten, die wie E-Mail-Adressen, Daten (YYYY-MM-DD), ISO-Datums-Zeiten, UUIDs und URIs aussehen.

Die Baumansicht verwenden

Wechseln Sie zum Tab Baumansicht. Fügen Sie JSON ein, und der Baum wird automatisch nach einem 500-ms-Debounce aufgebaut (kein Knopfdruck erforderlich). Klicken Sie auf einen Objekt- oder Array-Knoten, um ihn aufzuklappen oder zuzuklappen. Verwenden Sie das Suchfeld, um Knoten hervorzuheben, deren Schlüssel oder Wert Ihrem Begriff entspricht. Klicken Sie auf Alle aufklappen, um die gesamte Struktur auf einmal zu öffnen, oder fahren Sie mit der Maus über einen Knoten, um eine Schaltfläche zum Kopieren des Pfads anzuzeigen, die den Punkt-Notations-Pfad zu diesem Feld kopiert.

Praktische Beispiele

Debuggen einer API-Antwort

Eine REST-API gibt ein komprimiertes Benutzerprofil zur Fehlerbehebung zurück:

{"profile":{"id":"a3f8-bc21","created":"2025-11-03","tier":"pro","quota":{"used":14200,"limit":50000},"features":["export","api","webhooks"]}}

Fügen Sie es ein und klicken Sie auf „Formatieren" mit 2-Leerzeichen-Einrückung. Die Ausgabe zeigt sofort die Verschachtelungshierarchie, wodurch klar wird, dass quota ein verschachteltes Objekt mit zwei Feldern ist und features ein Array mit drei Zeichenketten. Kopieren Sie das Ergebnis und fügen Sie es in Ihren Fehlerbericht ein.

Validieren einer Konfigurationsdatei gegen ein Schema

Ihre Anwendung erwartet eine Konfiguration mit einem erforderlichen port-Integer zwischen 1 und 65535 und einer erforderlichen host-Zeichenkette. Fügen Sie die Konfigurations-JSON im linken Panel des Schema-Validators und ein Schema wie das folgende ein:

{
  "type": "object",
  "required": ["host", "port"],
  "properties": {
    "host": { "type": "string" },
    "port": { "type": "integer", "minimum": 1, "maximum": 65535 }
  }
}

Wenn port "8080" ist (eine Zeichenkette statt eines Integers), meldet der Validator: root.port — Expected integer, got string.

Ein Schema für einen neuen API-Vertrag generieren

Sie haben eine Beispielantwort von einer neuen Drittanbieter-API und müssen schnell ein JSON-Schema dafür schreiben. Fügen Sie das Beispiel im Tab „Schema-Generator" ein und klicken Sie auf „Schema generieren". Das Werkzeug erstellt in Sekunden ein Draft-07-Schema, das Sie anschließend manuell verfeinern können, indem Sie Einschränkungen wie minLength, pattern oder enum-Werte hinzufügen.

Tipps und Best Practices

Verwenden Sie die Tastenkürzel. Cmd+Enter formatiert und Cmd+Shift+M minimiert, ohne die Maus zu benutzen. Beim YAML Formatter ist das entsprechende Kürzel Cmd+Shift+J für die JSON-Konvertierung, aber bei diesem Werkzeug bedeutet Cmd+Shift+M immer Minimieren.

Überprüfen Sie die Reparaturbenachrichtigung. Wenn der Erfolgs-Toast „formatted and repaired" statt „formatted successfully" anzeigt, überprüfen Sie Ihre ursprüngliche Quelle. Die Reparatur hat möglicherweise einen echten Fehler in einer Konfigurationsdatei korrigiert, der an der Quelle behoben werden sollte.

Die Baumansicht wird automatisch aufgebaut. Sie müssen nicht auf „Baum aufbauen" klicken – der Baum rendert 500 ms nachdem Sie aufgehört haben zu tippen. Dies ist nützlich, um eine unbekannte Datenstruktur schnell zu erkunden, während Sie die Eingabe noch bearbeiten.

Kopieren Sie Pfade für JavaScript-Zugriff. Fahren Sie in der Baumansicht mit der Maus über einen Knoten und klicken Sie auf das erscheinende Kopiersymbol. Der kopierte Pfad (z. B. root.users[2].address.city) ist die genaue Punkt-Klammer-Notation, die Sie benötigen, um nach JSON.parse() in JavaScript auf diesen Wert zuzugreifen.

Der Schema-Generator markiert alle vorhandenen Schlüssel als erforderlich. Überprüfen Sie nach der Generierung eines Schemas das required-Array und entfernen Sie Felder, die in Ihrem Datenmodell tatsächlich optional sind.

Häufige Probleme und Fehlerbehebung

„Invalid JSON syntax"-Fehler nach dem Einfügen — Die Eingabe konnte nicht automatisch repariert werden. Häufige Ursachen sind doppelt maskierte Anführungszeichen beim Kopieren (\\" statt \"), oder binäre Zeichen, die aus einem Terminal eingefügt wurden. Versuchen Sie, das JSON in seiner Quellanwendung auszuwählen und erneut zu kopieren, oder prüfen Sie auf unsichtbare Zeichen.

Ausgabe ist nach dem Klicken auf „Formatieren" leer — Das Eingabefeld ist leer oder enthält nur Leerzeichen. Die Schaltfläche „Formatieren" ist deaktiviert, wenn die Eingabe leer ist, aber wenn sie dennoch ausgelöst wird, erscheint die Fehlermeldung „Please enter JSON to format" unterhalb des Ausgabepanels.

Schema-Validator zeigt „Invalid JSON data" — Der Text im linken Panel des Schema-Validators ist kein gültiges JSON. Im Gegensatz zum Tab „Formatieren" wendet der Schema-Validator keine automatische Reparatur an. Fügen Sie das JSON zuerst im Tab „Formatieren" ein, kopieren Sie die korrigierte Ausgabe und kehren Sie dann zum Schema-Validator zurück.

Baumansicht zeigt „Invalid JSON" — Die Baumansicht parst mit JSON.parse ohne Reparatur. Wenn Ihr JSON kleinere Probleme hat, formatieren Sie es zuerst im Tab „Formatieren", um eine saubere Kopie zu erhalten, und fügen Sie diese dann in die Baumansicht ein.

Download erzeugt jedes Mal eine Datei namens formatted.json — Dies ist beabsichtigt. Benennen Sie die Datei nach dem Herunterladen um.

Datenschutz und Sicherheit

JSON Formatter verarbeitet alles in Ihrem Browser mit JavaScript. Keine Eingabe – einschließlich sensibler API-Schlüssel, Tokens, Passwörter oder in JSON eingebetteter persönlicher Daten – wird an einen Server übertragen. Das Werkzeug funktioniert vollständig offline, nachdem die Seite geladen wurde. Es gibt keine Analytics-Hooks in der Formatierungslogik selbst. Sie können bedenkenlos Produktionsgeheimnisse, Datenbankzugangsdaten oder personenbezogene Daten in dieses Werkzeug einfügen, ohne dass Daten Ihren Computer verlassen.

Häufig gestellte Fragen

Ist JSON Formatter kostenlos? Ja, der JSON Formatter ist vollständig kostenlos nutzbar und ohne Nutzungslimits. Die Tabs „Formatieren", „Minimieren", „Schema-Validator", „Schema-Generator" und „Baumansicht" sind alle kostenlos verfügbar. Premium-Funktionen von Glyph Widgets Supportern wie gespeicherte Voreinstellungen, Sitzungshistorie und Werkzeugnotizen sind für Supporter verfügbar, aber die grundlegende Formatierungsfunktionalität erfordert nichts.

Funktioniert es offline? Ja. Sobald die Seite in Ihrem Browser geladen wurde, laufen alle Formatierungs- und Validierungsoperationen lokal in JavaScript. Sie können die Internetverbindung trennen und das Werkzeug ohne Funktionsverlust weiter nutzen.

Sind meine Daten sicher zum Einfügen? Ja. Die gesamte Verarbeitung findet in Ihrem Browser statt. Der Eingabetext wird niemals an einen Server gesendet, protokolliert oder außerhalb Ihrer Browser-Sitzung gespeichert. Sie können JSON, das API-Schlüssel, Passwörter oder persönliche Daten enthält, bedenkenlos formatieren.

Welche JSON-Formate behandelt die automatische Reparatur? Das Werkzeug verwendet die jsonrepair-Bibliothek, die einfach angeführte Zeichenketten, nachgestellte Kommas in Objekten und Arrays, nicht angeführte Property-Schlüssel, Kommentare (// und / /), fehlende schließende Klammern und verschiedene andere häufige Abweichungen von der JSON-Spezifikation behandelt.

Welche Einschränkungen unterstützt der Schema-Validator? Der Validator unterstützt type, enum, required, properties, additionalProperties, minProperties, maxProperties, minLength, maxLength, pattern, format (email, uri, date, date-time, ipv4, ipv6, uuid), minimum, maximum, exclusiveMinimum, exclusiveMaximum, multipleOf, minItems, maxItems, uniqueItems und items.

Welche Formate erkennt der Schema-Generator automatisch? Der Generator erkennt E-Mail-Adressen, ISO-Daten (YYYY-MM-DD), ISO-Datums-Zeiten, UUIDs und URIs. Er unterscheidet auch zwischen integer- und number-Typen für numerische Werte.

Kann ich ein Array statt eines Objekts validieren? Ja. Der Schema-Validator und der Schema-Generator akzeptieren beide jeden gültigen JSON-Wert auf der Root-Ebene – einschließlich Arrays, Zeichenketten, Zahlen und Booleans, nicht nur Objekte.

Was ist das Tastenkürzel zum Formatieren? Drücken Sie Cmd+Enter auf macOS oder Ctrl+Enter auf Windows und Linux, um das Formatieren auszulösen. Drücken Sie Cmd+Shift+M oder Ctrl+Shift+M zum Minimieren. Diese Kürzel sind nur aktiv, wenn der Tab „Formatieren/Minimieren" aktiv ist.

Kann das Werkzeug sehr große JSON-Dateien verarbeiten? Das Werkzeug speichert bis zu 10.000 Zeichen pro Historien-Eintrag, aber das Formatieren selbst hat kein eingebautes Limit außer dem Browser-Speicher. Sehr große Dateien (mehrere Megabyte) werden korrekt formatiert, aber das Textfeld kann sich auf leistungsschwächeren Geräten träge anfühlen.

Auf welchen Schema-Draft zielt das generierte Schema ab? Der Generator erstellt JSON-Schema-Draft-07-Dokumente, gekennzeichnet durch "$schema": "http://json-schema.org/draft-07/schema#" in der Ausgabe.

Verwandte Werkzeuge

XML Formatter — XML-Dokumente mit denselben Einrückungskontrollen und Minifizierungsunterstützung formatieren und validieren.

YAML Formatter — YAML-Dateien formatieren und direkt in JSON-Ausgabe mit konfigurierbarer Einrückung konvertieren.

JSON Converter — JSON in und aus CSV, XML, YAML und anderen Datenformaten konvertieren.

JSON Formatter jetzt ausprobieren: JSON Formatter