Rein lokale Berechnung im Browser, insgesamt20+ Funktionen

Die nächste Generation der JSON-Online-Werkbank

Datenaufgaben in der Entwicklung an einem Ort. Keine sensiblen Daten auf Server laden – alles schnell auf Ihrem Gerät.

Warum bevorzugen Entwickler native Frontend-Daten-Tools?

Beim API-Debuggen, in Logs und in Configs bearbeiten wir täglich JSON. Klassische Online-Seiten schicken Inhalte oft an ein Backend – Risiko für Datenlecks und Wartezeiten. Hier rechnet der Browser lokal, als vollständig lokale Werkbank.

1

Kein Serverkontakt, maximale Sicherheit

Ob Produktions-JSON oder JWT mit Auth-Infos: alles läuft nur im Speicher des aktuellen Browsers. Nach Neuladen oder Schließen der Seite ist der Inhalt weg.

2

Volle JSON5-Kompatibilität

Kopierter Code mit // Kommentaren oder trailing commas muss nicht erst per Hand gelöscht werden. Die JSON5-Engine erkennt einfach und doppelte Anführungszeichen und wandelt mit einem Klick in RFC-konformes Standard-JSON.

3

Komplexe Strukturen vergleichen und erzeugen

Diff zweier Configs wie in Git hervorheben. Der Codegenerator exportiert aus verschachtelten Modellen typisierte Klassen für Java, C#, Go, TypeScript und mehr.

23
Lokale Tools
20+
Sprachen für Codegenerierung
0
Daten-Upload
#data
Über die Adressleiste einfügen

Welches Tool passt zur Aufgabe?

Sie müssen nicht jede Funktion öffnen. Vier Wege decken den Alltag beim Debuggen ab.

Struktur sehen, Felder ändern

Zuerst mit Formatieren verschönern und prüfen; bei tiefer Schachtelung zur Baumansicht zum Ein- und Ausklappen; Zeitstempel, Farben und Links mit Felderkennung vorschauen.

Daten aus großem JSON ziehen

Mit JSONPath schreiben Sie $Mit.. und Filterausdrücke – nur lesen, Original bleibt. Gut, um aus einer API-Antwort eine Liste-Ebene zu ziehen.

Zwei Configs passen nicht zusammen

Diff semantische Differenzen sehen; zum Zusammenführen Merge für Deep-Merge oder Array-Merge. Vorher optional nach Key sortieren semantische Differenzen sehen; zum Zusammenführen

In drei Schritten starten

Die Startseite dient der Auswahl; das eigentliche Editieren passiert in eigenen Arbeitsbereichen, damit Katalog und Eingabe sich nicht denselben Bildschirm teilen.

01

Tool im Katalog öffnen

Suche nach JWT, Diff, YAML und anderen Begriffen oder Karte antippen, um den Arbeitsbereich zu öffnen.

02

Einfügen, per Hash laden oder remote holen

Text direkt in den Editor. Alternativ per #data={...} einfügen oder #url= öffentliches JSON über das aktuelle Netz laden.

03

Ergebnis kopieren – geschlossen ist geleert

Formatieren, Konvertieren und Dekodieren laufen im Speicher des Tabs. Nach Neuladen oder Schließen bleibt nichts auf einem Server.

Fortgeschritten: Daten über die Adressleiste

Der Hash steht hinter # , nicht hinter dem Fragezeichen. Zum Beispiel json-formatierung.html#data={"name":"Ada"} . Nach dem Lesen wird er aus der Adressleiste entfernt, damit Payloads nicht in der Historie bleiben. Vollbild mit ?fullscreenDer Hash steht hinter

Was lockert JSON5 gegenüber Standard-JSON?

Aus Repos oder Configs kopierter Inhalt hat oft Kommentare und trailing commas. Standard- JSON.parse schlägt dann fehl; JSON5-Tool parst fehlertolerant und gibt RFC-konformen Text aus.

Kommentare

Standard-JSON nicht erlaubt

JSON5 Einzeilig // und mehrzeilig /* */

Keys

Standard-JSON müssen doppelte Anführungszeichen haben

JSON5 ohne Anführungszeichen, Unicode möglich

Strings

Standard-JSON nur doppelte Anführungszeichen

JSON5 einfache Anführungszeichen, mehrzeilige Fortsetzung

Trailing comma

Standard-JSON nicht erlaubt

JSON5 bei Objekten und Arrays erlaubt

Zahlen

Standard-JSON Dezimal

JSON5 Hexadezimal, .5 / 5.Hexadezimal,

JWT im Browser zerlegen

JWT-Dekodierung Nach RFC 7519 in Header / Payload / Signatur. Das Token geht nicht an einen Server. Diese Version dekodiert lokal und ordnet Claims zu – private Schlüssel kommen nicht ins Web für Signaturprüfungen.

Häufige Payload-Claims

iss Aussteller
sub Betreff / Benutzer-ID
aud Empfänger
exp Ablaufzeit
nbf Gültig ab
iat Ausstellungszeit
jti ID, gegen Replay

Lokale Dekodierung

Wann lokal dekodieren?

  • Login debuggen, prüfen von exp / sub
  • Eigene Claims ansehen, Token bleibt im Browser
  • Signaturprüfung in Produktion bleibt auf dem Backend, Schlüssel nicht ins Web

Bei sehr großen Integer-IDs auf die JavaScript-Zahlengenauigkeit achten: Original-Payload-String vergleichen, nicht nur die Number.

JWT-Dekodierung öffnen

Ein Beispiel-JSON, Entitäten in vielen Sprachen

Codegenerierung leitet Typen aus verschachtelten Objekten und Arrays ab und exportiert Interfaces, Structs oder Data Classes. Gut, wenn zuerst die API-Antwort da ist und danach Frontend-/Backend-Modelle folgen.

TypeScriptJavaScriptJavaC# GoRustPythonKotlin SwiftDartPHPRuby ScalaC++Objective-CFlow HaskellElmCrystalPike

Entwicklernotizen

Kurze Texte, die Tools in echte Workflows einbauen. Für die volle Erklärung den Blog öffnen.

Vorlagenartikel

Struktur der Blog-Artikelseite kopieren: Titel, Einleitung, Inhaltsverzeichnis, Tabellen, FAQ und verwandte Artikel.

Anleitung und häufige Fragen (FAQ)

Wie importiere ich Daten schnell zum Formatieren?

Auf der Startseite das Tool öffnen, im Arbeitsbereich Text einfügen. Optional Hash-Parameter an die Arbeitsbereich-URL anhängen, z. B. json-formatierung.html#data={"key":"value"} ; nach dem Lesen wird der Parameter entfernt und automatisch formatiert. Remote-Dateien über #url=...Auf der Startseite das Tool öffnen, im Arbeitsbereich Text einfügen. Optional Hash-Parameter an die Arbeitsbereich-URL anhängen, z. B.

Wie funktionieren YAML-Konvertierung und JSON-Schema-Validierung?

YAML wird im Browser bidirektional synchronisiert; das Schema-Tool zeigt fehlende Pflichtfelder oder Typfehler. JWT dekodiert derzeit nur Header / Payload und sendet das Token nicht an einen Server.

Werden Daten hochgeladen?

Nein. Parsen, Konvertieren und JWT-Dekodierung laufen im aktuellen Tab. Nach Schließen oder Neuladen ist der Speicherinhalt weg.

Warum sind Startseite und Arbeitsbereich getrennt?

Der Katalog dient zum Durchsuchen und Suchen, der Arbeitsbereich zum Editieren. Sie liegen nicht auf einem Screen – beim Scrollen bleibt das Eingabefeld sichtbar, lange Listen und Editor stehen sich nicht im Weg.

Welche Formate können konvertiert werden?

Derzeit YAML, XML, CSV, Excel, GET-Query, JSON Schema und GraphQL. Cookie-Strings werden zu JSON-Objekten. Alles lokal.

Hängen große Dateien?

Die Verarbeitung läuft im Browser auf Ihrem Rechner; Tempo hängt von Gerät und JSON-Größe ab. Bei mehreren MB prüfen, ob wirklich das ganze Paket nötig ist; Baumansicht und JSONPath eignen sich, nur einen Teil zu betrachten.