Indsæt JSON her for at se detIndsæt JSON

Hvad er JSON Viewer?

JSON er fantastisk for maskiner og forfærdelig for øjnene. Fem niveauer af krøllede parenteser, hængende kommaer, én lang linje — du kender det. JSON Viewer laver det om til noget du faktisk kan gennemse: hver array bliver en række, hvert objekt bliver et sæt kolonner, og nestede strukturer bliver tabeller-i-tabeller, du kan dykke ned i.

Den er bygget til det øjeblik, hvor du bare vil SE dataene. Ikke parse dem, ikke validere dem, ikke konvertere dem — se dem. Smid et fetch-svar, en GraphQL-payload, en loglinje, hvad som helst, ind. Vieweren lægger det ud, så du på et sekund kan se, om API'et returnerede det, du forventede, og om formen passer til det, din kode vil have.

Alt kører i din browser — ingen upload, ingen konto, ingen grænser for hvor mange indsæt-og-se-runder du kan brænde af på en eftermiddag.

Sådan ser du JSON her

Tre trin til en struktureret visning af dine data. Knapperne under editoren matcher det, du læser her.

1

Indsæt eller indlæs et eksempel

Kopiér JSON fra din API-klient (Postman, Insomnia, Network-fanen i browserens DevTools) og indsæt til venstre. Vil du først se vieweren i aktion, så tryk Eksempel for at indlæse et lille datasæt.

{"order": {"id": "ORD-4821", "customer": {"name": "Priya Shah", "tier": "gold"}, "items": [{"sku": "SKU-101", "qty": 2}, {"sku": "SKU-204", "qty": 1}], "total": 189.50}}

Hvis din JSON er fejlbehæftet, ser du en besked lige under editoren, der peger på hvor parseren gav op.

2

Gennemse strukturen

Højre side gentegner sig øjeblikkeligt, når dit input ændrer sig. Arrays af objekter dukker op som rækker med kolonner for hver nøgle. Nestede objekter og arrays bliver deres egne mini-tabeller inde i cellen, så du kan følge en kæde som order.customer.tier visuelt. Brug Hoved eller Nestet til at vende orienteringen, når en post har flere nøgler end rækker — nogle gange er det lettere at læse nøgler som rækker og værdier som kolonner. Layoutet følger JSON-typerne defineret i RFC 8259.

3

Indsnævr det, du kigger på

Hver kolonne har et filterfelt. Skriv gold i tier-kolonnen, SKU-1 i en SKU-kolonne, pending i en statuskolonne — rækker der ikke matcher, bliver skjult. Filtre er case-insensitive og stables (tier=gold OG status=paid). Hvis en kolonne roder i din visning, så klik Rediger og derefter fjern-ikonet (×) på overskriften for at droppe den.

4

Gå i fuldskærm for bred data

Til datasæt med 20+ kolonner, tryk Fuldskærm. Tabellen udvides til hele viewporten, så du kan scrolle vandret uden sidepanelet i vejen. Godt til at debugge en fed GraphQL-forespørgsel eller en denormaliseret rapport.

5

Del eller eksporter når du er færdig

Fandt du noget værd at flage? Tryk Del for at lave et kort link (1 time, 1 dag eller 1 uge) og send det til en kollega — de åbner samme visning, samme JSON, uden at skulle indsætte igen. Eller klik Excel for at hente tabellen som .xls til Excel, Google Sheets eller LibreOffice. Parsningen sker klientsiden via JSON.parse().

Hvornår vieweren betaler sig

Hurtig gennemlæsning af API-svar

Du rammer et endpoint i Postman, får 8 KB JSON tilbage og skal vide, om et nestet shipping.address.country-felt er udfyldt. Indsæt svaret her og du har svaret på to sekunder. Ingen mental JSON-parsning nødvendig.

Læse logstreams

Strukturerede logs fra <a href="https://www.elastic.co/elasticsearch" target="_blank" rel="noopener">Elasticsearch</a>, CloudWatch eller en vilkårlig JSON-line-logger lander som enkeltlinjede klumper. Smid en ind her for at se timestamp, service, level, besked og trace-id lagt klart ud — brugbart når du følger en ustabil service klokken 2 om natten.

Gennemgå skema-eksempler

Kigger du på eksempel-payloads i en <a href="https://swagger.io/specification/" target="_blank" rel="noopener">Swagger/OpenAPI</a>-spec eller et teams README? Indsæt eksempelblokken og gå gennem formen felt for felt. Hurtigere end at læse indrykket JSON fra top til bund, og du ser valgfri/manglende felter med det samme.

Vise data til interessenter

Din PM vil vide, hvad checkout-API'et returnerer, men "her er en JSON-blob" flyver ikke. Lav et delingslink, indsæt det i Slack, og de ser en ordentlig tabel — ingen forklaring af parenteser og koloner nødvendig.

FAQ

Hvad er forskellen på en JSON viewer og en JSON parser?

De overlapper kraftigt, men vinklen er forskellig. En parser fokuserer på selve det at lave JSON-tekst om til en brugbar struktur (og flage dårlig syntaks). En viewer fokuserer på outputtet — hvordan det parsede resultat bliver præsenteret, så du kan læse det. Dette værktøj gør begge dele under motorhjelmen, men UI'et er tunet til at gennemse store eller dybt nestede data frem for bare at validere dem.

Forlader mine data browseren?

Nej. Parsning og rendering sker lokalt med JavaScript. Data forlader kun browseren, hvis du klikker "Del" for at lave et kort link, og selv da styrer du udløbet (1 time til 1 uge). Kigger du på noget følsomt, så lad være med at dele — luk fanen og det er væk.

Hvor dybt må nestningen gå?

Ingen hård grænse. Vieweren renderer rekursivt nestede arrays og objekter i den dybde, du kaster på den. Dybe strukturer bliver visuelt travle på et tidspunkt — fem-seks niveauer nede kan det være en idé at bruge filterrækken til at fokusere på den gren, du faktisk interesserer dig for, eller vende nestet orientering med Nestet-knappen.

Kan jeg også se arrays af primitiver, ikke kun objekter?

Ja. En array som ["read", "write", "admin"] renderes som en enkelt-kolonneliste. Blandede arrays (objekter + primitiver) virker også — hvert element får sin egen række, og vieweren regner kolonnesættet ud fra hvilke nøgler der findes på tværs af objekterne.

Hvorfor er nogle kolonner væk efter jeg opfriskede JSON-en?

Hvis du tidligere fjernede kolonner (via ×-ikonet i redigeringstilstand), husker vieweren det for den aktuelle session og skjuler også de underliggende nøgler fra JSON-en. At indsætte ny JSON kører detekteringen igen. Mangler en kolonne du forventer, så tjek om redigeringstilstanden droppede den, eller om nøglen rent faktisk findes i hver post.

Hvor stor en JSON-fil er behagelig?

Filer op til et par MB renderes hurtigt. Over 5 MB mærker du browseren arbejde. Over 10 MB bliver det træls men vieweren klarer det stadig — arbejder du rutinemæssigt med 50 MB+ datasæt, så tag et CLI-værktøj som jq eller gron først og indsæt den relevante del her.

Relaterede JSON-værktøjer

At se er én bid af, hvad du måske vil gøre med JSON. Har du brug for noget mere specifikt, så prøv disse: