JSON Editor

Was der JSON Editor kann: JSON formatieren, reparieren, gegen ein JSON Schema prüfen und transformieren — große Zahlen bleiben exakt, fast alles im Browser.

Ein Editor für JSON — formatieren, prüfen, umbauen

Der JSON Editor ist ein vollwertiger JSON-Editor im Browser. Du fügst JSON-Daten ein — getippt, aus der Zwischenablage, als Datei oder von einer URL — und arbeitest damit in drei Ansichten: als aufklappbarer Baum (Tree), als Tabelle für Datensätze und als reine Code-Ansicht mit Syntax-Hervorhebung. Formatieren, minifizieren, reparieren, gegen ein JSON Schema prüfen, sortieren, durchsuchen und transformieren ist alles eine Sache von einem Klick oder einem Tastenkürzel. Dabei bleiben große Zahlen wie 64-Bit-IDs auf die letzte Stelle exakt.

Gedacht ist das Tool für alle, die regelmäßig mit JSON hantieren: Entwicklerinnen und Entwickler, die eine API-Antwort schnell lesbar machen, ein Config-File entwirren oder kaputtes JSON aus einem Log retten wollen; Daten-Leute, die eine Liste von Objekten wie eine Tabelle durchsehen; und alle, die mal eben prüfen müssen, ob ein JSON-Schnipsel überhaupt gültig ist — oder ob es zu einem vereinbarten Schema passt. Kein Account, keine Installation, kein Upload — bis auf das Laden von einer URL passiert alles lokal in deinem Browser.

Was der Editor kann

Die Funktionen lassen sich in vier Gruppen denken: aufbereiten, prüfen, exakt bewahren und umbauen.

  • Formatieren und minifizieren — Format (Beautify) rückt das JSON mit zwei Leerzeichen sauber ein und macht es lesbar; Compact presst es wieder in eine einzige Zeile ohne überflüssige Leerzeichen für die Auslieferung. Dazu sortiert Sort keys alle Objekt-Schlüssel rekursiv. Jede dieser Aktionen nimmst du mit Ctrl+Z zurück.
  • Validieren und reparieren — der Editor prüft das JSON in Echtzeit auf Syntaxfehler und zeigt die Stelle an. Repair behebt häufige Fehler mit einem Klick — etwa abschließende Kommas, einfache statt doppelte Anführungszeichen, Kommentare, JSONP-Hüllen oder Python-Konstanten wie True und None. Über Schema prüfst du das Dokument zusätzlich gegen ein JSON Schema (Draft 4 bis 2020-12); Verstöße werden direkt im Editor markiert.
  • Exakt bleiben — als Parser arbeitet lossless-json: Große Ganzzahlen, Dezimalstellen wie 1.10 und doppelte Schlüssel gehen nicht stillschweigend verloren, sondern bleiben erhalten bzw. werden gemeldet.
  • Transformieren und durchsuchen — über das eingebaute Transform-Werkzeug filterst, sortierst und projizierst du Daten (per Abfrage-Assistent in JSONQuery mit Live-Vorschau); Suchen & Ersetzen, Tastatur-Navigation, Undo/Redo und Drag-and-drop im Baum gehören ebenfalls dazu.

Dazu kommen die praktischen Helfer im Menü File: Datei öffnen (auch per Drag-and-drop), JSON von einer URL laden, normal oder minifiziert herunterladen und kopieren, das Dokument durch die Zwischenablage ersetzen. Außerdem gibt es eine Statistik in der Fußzeile, den Vollbild-Modus und eine automatische Speicherung im Browser, die deinen Stand über Reloads hinweg hält. Welche Funktion genau was tut, steht im Manual.

Drei Ansichten auf dieselben Daten

Das Herzstück ist die Möglichkeit, jederzeit zwischen drei Sichten auf dasselbe Dokument zu wechseln — über die Buttons text, tree und table in der Menüleiste des Editors:

  • Tree — der aufklappbare Baum: Knoten ein- und ausklappen, per Drag-and-drop umsortieren, Schlüssel und Werte direkt bearbeiten, Kontextmenü per Rechtsklick.
  • Table — eine tabellarische Sicht, ideal für ein Array von Objekten: bearbeiten wie in einer Tabellenkalkulation, Spalten durch Klick sortieren, Zeilen hinzufügen und entfernen.
  • Text — die reine Code-Ansicht mit Syntax-Hervorhebung, Zeilennummern, Code-Faltung sowie Suchen & Ersetzen.

Im Browser, mit einer Ausnahme

Architektonisch ist der JSON Editor eine Client-Anwendung: Bearbeiten, Reparieren, Schema-Prüfung und Statistik laufen in deinem Browser, geladene Dateien liest er lokal, der Download entsteht ebenfalls dort. Die einzige Ausnahme ist Load from URL: Diesen Abruf erledigt ein Proxy auf dem Server der Website — nur für öffentliche Adressen und bis 2 MB (Details im Manual). Unter der Haube arbeiten die quelloffenen Bibliotheken vanilla-jsoneditor (öffnet in neuem Tab), lossless-json und jsonrepair von Jos de Jong sowie @cfworker/json-schema (alle englisch); die Code-Ansicht basiert auf CodeMirror 6. Dein Arbeitsstand wird automatisch im Local Storage deines Browsers gesichert — bequem, aber auf einem geteilten Rechner ein Punkt, den du kennen solltest (Details im Manual).

Jetzt ausprobieren

→ JSON Editor öffnen — JSON einfügen oder eine Datei laden, Ansicht wählen, loslegen. Ohne Account, kostenlos, direkt im Browser. Beim ersten Öffnen liegt ein kleines Beispiel-Dokument im Editor, an dem du alle Funktionen sofort durchprobieren kannst; über File → Load example holst du es jederzeit zurück.

Verwandte JPKCom-Tools

Wenn JSON nur eine Station in deinem Workflow ist, helfen diese Tools weiter:

  • Convertor PRO — JSON in andere Formate wandeln und zurück: YAML, TOML, XML, Unicode/UTF-8 und mehr. Der direkte Partner, wenn dein JSON woanders hin soll; die Fußzeile des JSON Editors verlinkt ihn.
  • CSV Editor — tabellarische Daten als CSV bearbeiten und exportieren, mit Format-Erkennung. Praktisch, wenn dein Array von Objekten eigentlich eine Tabelle ist.
  • Coder — HTML-Entities, URLs, Base64, JWT-Tokens und Data-URIs en- und decodieren. Nützlich, wenn in deinem JSON kodierte Werte stecken.

Tiefer geht es auf den Unterseiten: das Manual mit jeder Funktion und Ansicht im Detail, Beispiele aus der Praxis und gesammelte Tipps & Tricks.