Formatieren, validieren und erkunden Sie JSON-Daten sofort in Ihrem Browser
JSON (JavaScript Object Notation) ist die Lingua Franca moderner Software. Egal, ob Sie ein Entwickler sind, der eine API-Antwort debuggt, ein Datenanalyst, der eine Konfigurationsdatei inspiziert, oder ein nicht-technischer Benutzer, der versucht, strukturierte Daten zu verstehen, das Lesen von rohem JSON kann frustrierend sein. Ein fehlendes Komma oder eine falsch platzierte Klammer kann eine gesamte Anwendung zum Absturz bringen, und unformatiertes JSON ist visuell nahezu unmöglich zu scannen.
JSON verstehen
Was ist JSON?
JSON (JavaScript Object Notation) ist ein leichtgewichtiges, textbasiertes Datenformat für den Austausch von Daten, das durch RFC 8259 definiert ist. Es stellt strukturierte Daten als Sammlung von Namens/Wert-Paaren (Objekten) und geordneten Listen (Arrays) dar. JSON unterstützt sechs Datentypen: Zeichenfolgen (in doppelte Anführungszeichen eingeschlossen), Zahlen (ganzzahlig oder Gleitkomma), Booleans (wahr oder falsch), null, Objekte (geschweifte Klammern, die Schlüssel-Wert-Paare enthalten) und Arrays (eckige Klammern, die Werte enthalten). Da JSON sprachunabhängig und menschenlesbar ist, hat es sich zum dominierenden Format für REST-APIs, Konfigurationsdateien, NoSQL-Datenbanken und die Kommunikation zwischen Diensten in nahezu jeder Programmiersprache und Plattform entwickelt.
Wie funktioniert die Formatierung?
Die JSON-Formatierung verwendet die integrierte Funktion JSON.parse() des Browsers, um den Eingabestring in einen nativen JavaScript-Wert zu deserialisieren, und serialisiert ihn dann mit JSON.stringify() unter Verwendung des gewählten Einrückungsniveaus erneut. Wenn JSON.parse() einen Syntaxfehler auslöst, fängt der Formatter ihn ab, extrahiert die Zeichenposition aus der Fehlermeldung, ordnet diese Position zurück zu einer Zeilen- und Spaltennummer in der ursprünglichen Eingabe und zeigt einen menschenlesbaren Fehler an. Die Minimierung funktioniert identisch, übergibt jedoch kein Einrückungsargument an JSON.stringify(), wodurch die kompakteste mögliche Darstellung erzeugt wird. Auto-Fix wendet eine Reihe von Texttransformationen vor dem Parsen an, um häufige Probleme wie überflüssige Kommas, einfache Anführungszeichen und nicht zitierte Schlüssel zu korrigieren.
Warum ist JSON-Formatierung wichtig?
Unformatiertes oder minimiertes JSON ist für Menschen nahezu unlesbar. Eine einzeilige Payload, die sich über Tausende von Zeichen erstreckt, macht es praktisch unmöglich, ein fehlendes Feld, einen falschen Wert oder einen strukturellen Fehler zu erkennen. Eine ordnungsgemäße Einrückung zeigt die Hierarchie der Daten sofort – Sie können auf einen Blick sehen, welche Schlüssel zu welchem Objekt gehören, wie tief ein Array verschachtelt ist und wo eine Struktur beginnt und endet. Für das Debuggen von API-Antworten, das Überprüfen von Konfigurationsdateien oder die Kommunikation von Datenstrukturen an Kollegen reduziert gut formatiertes JSON die kognitive Belastung erheblich. Die Validierung ist ebenso wichtig: Ein einzelner Syntaxfehler in einer JSON-Konfigurationsdatei kann eine Anwendung beim Start zum Absturz bringen, und das Auffinden dieses Fehlers vor der Bereitstellung spart Zeit und verhindert Vorfälle.
Einschränkungen und Hinweise
Der Formatter arbeitet mit gültigem JSON, wie es durch den RFC 8259-Standard definiert ist. JSON unterstützt keine Kommentare, überflüssige Kommas oder einfach zitierte Zeichenfolgen – Merkmale, die in JavaScript-Objektliteralen und Konfigurationsformaten wie JSONC oder JSON5 üblich sind. Die Auto-Fix-Funktion behandelt viele dieser Fälle, aber es handelt sich um einen heuristischen Prozess und möglicherweise nicht in der Lage, jeden Grenzfall korrekt zu behandeln, insbesondere bei tief fehlerhaften Eingaben. Sehr große JSON-Dateien (mehrere Megabyte) können vorübergehende UI-Verzögerungen verursachen, da die Verarbeitung im Haupt-Thread des Browsers erfolgt. Der CSV-Export funktioniert nur bei Arrays flacher Objekte; verschachtelte Objekte innerhalb von Array-Elementen werden als JSON-Strings serialisiert, anstatt in Spalten zu flatten. Alle Verarbeitung erfolgt rein clientseitig – keine Daten werden irgendwohin übertragen.
So verwenden Sie diesen Formatter
Fügen Sie Ihr JSON ein oder laden Sie es hoch
Kopieren Sie Ihren JSON-String aus einer API-Antwort, einer Konfigurationsdatei oder einer beliebigen Quelle und fügen Sie ihn in das Eingabefeld ein. Alternativ klicken Sie auf 'Datei hochladen', um eine .json-Datei direkt von Ihrem Computer zu importieren. Der Formatter beginnt automatisch mit der Verarbeitung, während Sie tippen.
Wählen Sie Formatierungsoptionen
Wählen Sie Ihre bevorzugte Einrückung (2 Leerzeichen für kompakte Ausgabe, 4 Leerzeichen für zusätzliche Lesbarkeit oder Tabulator für traditionelle Formatierung). Aktivieren Sie 'Schlüssel sortieren', wenn Sie möchten, dass alle Objekt-Schlüssel alphabetisch geordnet sind – nützlich beim Vergleichen zweier JSON-Objekte oder beim Generieren deterministischer Ausgaben.
Überprüfen Sie das Ergebnis
Ein grünes Abzeichen bestätigt, dass das JSON gültig ist. Bei einem Syntaxfehler zeigt ein rotes Abzeichen die genaue Zeilen- und Spaltennummer zusammen mit einer Beschreibung des Fehlers in einfacher Sprache an. Verwenden Sie die Schaltfläche 'Auto-Fix', um häufige Probleme wie überflüssige Kommas, einfache Anführungszeichen und nicht zitierte Schlüssel automatisch zu beheben, bevor Sie formatieren.
Kopieren, Herunterladen oder Erkunden
Wechseln Sie zwischen der formatierten Ansicht (syntax-hervorgehobener Code), der Baumansicht (interaktive zusammenklappbare Hierarchie) und dem CSV-Tab (für Arrays von Objekten). Kopieren Sie die Ausgabe in die Zwischenablage oder laden Sie sie als .json- oder .csv-Datei herunter. Überprüfen Sie die Größenvergleichsbalken, um zu sehen, wie viel die Minimierung Ihre Nutzlast reduziert.
Häufig gestellte Fragen
Ist meine JSON-Daten sicher hier einzufügen?
Ja, vollkommen. Der JSON-Formatter läuft vollständig in Ihrem Browser mit clientseitigem JavaScript. Ihre Daten werden niemals an einen Server gesendet, niemals gespeichert und niemals protokolliert. Alles geschieht lokal auf Ihrem Gerät – selbst wenn Sie nach dem Laden der Seite die Internetverbindung trennen, funktioniert der Formatter weiter. Dies macht es sicher, ihn mit API-Token, Datenbanknutzlasten, internen Konfigurationsdateien oder anderen sensiblen Daten zu verwenden, die Sie nicht über ein Netzwerk übertragen möchten.
Was macht die Auto-Fix-Schaltfläche?
Auto-Fix wendet eine Reihe von heuristischen Reparaturen auf fehlerhaftes JSON an, bevor es geparst wird. Es behandelt die häufigsten Probleme aus der Praxis: Entfernen von überflüssigen Kommas (die von JavaScript-Objektliteralen übrig geblieben sind), Umwandeln von einfachen Anführungszeichen in doppelte Anführungszeichen, Hinzufügen fehlender Anführungszeichen um nicht zitierte Objekt-Schlüssel, Ersetzen von Python-Stil None/True/False durch JSON null/true/false, Entfernen von JavaScript-Stil Kommentaren (// und /* */), Normalisieren von geschweiften oder 'intelligenten' Anführungszeichen, die aus Textverarbeitungsprogrammen eingefügt wurden, Entfernen von JSONP-Funktionshüllen und Umwandeln von zeilengetrenntem JSON (NDJSON) in ein gültiges JSON-Array. Auto-Fix ist ein Best-Effort-Tool – es funktioniert gut für häufige Fälle, kann jedoch schwer beschädigte Daten nicht reparieren.
Was ist der Unterschied zwischen Formatieren und Minimieren?
Formatierung (auch als Verschönern oder Schön-Drucken bezeichnet) fügt Einrückungen und Zeilenumbrüche hinzu, um JSON leicht lesbar zu machen. Es ist ideal für Entwicklung, Debugging und Dokumentation. Minimieren macht das Gegenteil: Es entfernt alle unnötigen Leerzeichen – Leerzeichen, Tabs und Zeilenumbrüche – und erzeugt die kompakteste mögliche Darstellung derselben Daten. Minimiertes JSON ist schneller über ein Netzwerk zu übertragen und verbraucht weniger Bandbreite, was es zum bevorzugten Format für API-Antworten in der Produktion macht. Die beiden Darstellungen enthalten genau dieselben Daten; nur die Formatierung unterscheidet sich. Unsere Größenvergleichsbalken zeigen Ihnen numerisch, wie viel kleiner die minimierte Ausgabe ist.
Wie funktioniert die Baumansicht?
Die Baumansicht rendert Ihr JSON als interaktive zusammenklappbare Hierarchie. Jedes Objekt und Array wird mit einem Umschaltpfeil angezeigt, der seine Kinder erweitert oder zusammenklappt. Ein Klick auf einen Knoten öffnet oder schließt ihn. Standardmäßig sind die ersten beiden Ebenen erweitert, sodass Sie die oberste Struktur sofort sehen können, ohne von tief verschachtelten Daten überwältigt zu werden. Die Schaltflächen Alle erweitern und Alle zusammenklappen schalten den gesamten Baum auf einmal um. Wenn Sie mit der Maus über einen Knoten fahren, wird ein kleines Kopiersymbol angezeigt, mit dem Sie nur den Wert dieses Knotens als formatiertes JSON kopieren können – perfekt, wenn Sie ein bestimmtes verschachteltes Objekt aus einer großen Antwort benötigen.
Wann erscheint der CSV-Tab?
Der CSV-Tab erscheint automatisch, wenn Ihr JSON ein gültiges Array von Objekten ist – ein Muster, das von praktisch jeder REST-API zurückgegeben wird, die Ressourcen auflistet (Benutzer, Produkte, Bestellungen usw.). Der Konverter extrahiert alle eindeutigen Schlüssel aus allen Objekten als Spaltenüberschriften und ordnet dann die Werte jedes Objekts den entsprechenden Spalten zu. Verschachtelte Objekte innerhalb von Array-Elementen werden als JSON-Strings serialisiert, anstatt in Unterspalten abgeflacht zu werden. Die resultierende CSV kann heruntergeladen und direkt in Excel, Google Sheets oder einer anderen Tabellenkalkulationsanwendung geöffnet werden. Wenn Ihr JSON ein einzelnes Objekt ist oder nicht-objektbasierte Array-Elemente enthält, ist der CSV-Tab ausgeblendet.
Welche Einrückung sollte ich wählen?
Die Wahl hängt von Ihrem Anwendungsfall und den Teamkonventionen ab. Zwei Leerzeichen sind die beliebteste Wahl in JavaScript, TypeScript und JSON-Konfigurationsdateien – sie halten die Dateien kompakt und dennoch lesbar. Vier Leerzeichen sind in Python-Projekten und einigen Java-Umgebungen üblich. Tabs werden von einigen Teams bevorzugt, da sie es jedem Entwickler ermöglichen, seinen Editor so zu konfigurieren, dass sie in jeder visuellen Breite angezeigt werden. Im Zweifelsfall überprüfen Sie die .editorconfig oder die Linting-Konfiguration Ihres Projekts. Für das Teilen von JSON in Dokumentationen oder Nachrichten, in denen die visuelle Ausrichtung wichtiger ist als die Dateigröße, sind 4 Leerzeichen in der Regel am klarsten. Für Produktions-API-Antworten verwenden Sie immer Minimierung anstelle von Einrückungen.