JSON-trevisning på nett — utforsk store og nøstede JSON-strukturer

Lim inn eller last opp JSON-en din og bla gjennom den som et interaktivt, sammenleggbart tre i stedet for en vegg av tekst. Klikk på en hvilken som helst node for å utvide eller kollapse den, og bruk søkeboksen for å hoppe rett til en nøkkel eller verdi begravet dypt inne i en stor struktur. Alt kjøres lokalt i nettleseren din — dataene dine lastes aldri opp.

Hva er dette verktøyet?

En JSON-trevisning gjør et JSON-dokument om til en navigerbar disposisjon: hvert objekt og hver array blir en node du kan utvide eller kollapse, hver nøkkel viser sin utledede type, og hver løvverdi vises inline. I stedet for å rulle gjennom tusenvis av linjer med tekst, går du bare ned i grenene du faktisk bryr deg om.

Dette er annerledes enn en JSON-formatering. En formatering skriver om teksten i JSON-en din med innrykk slik at den ser penere ut — det er riktig verktøy når du bare trenger å pynte, minifisere eller validere syntaks. En trevisning er for å utforske og navigere selve strukturen, spesielt når JSON-en er stor, dypt nøstet, eller du ennå ikke vet hvor dataene du trenger befinner seg. Vil du bare pynte eller validere JSON-tekst, bruk JSON-formateringen i stedet.

Hvorfor bruke det?

Naviger dypt nøstede API-responser eller konfigfiler uten å miste oversikten over hvilken klamme som tilhører hvilket nivå.
Søk etter nøkkelnavn eller verdi og hopp rett til treffet, med stien automatisk utvidet for deg.
Håndterer svært store JSON-filer (flere megabyte) smidig — undernoder bygges bare når du utvider dem, så ingenting fryser fanen.
Se typen til hver verdi med et blikk — streng, tall, boolsk, null, objekt eller array — med tydelige merkelapper.
100 % privat: tolkning og gjengivelse skjer helt i nettleseren din, ingenting lastes opp eller lagres.

Slik bruker du det

Lim JSON-en din inn i inndataboksen, eller bruk filvelgeren for å laste inn en JSON-fil fra disken.
Klikk «Gjengi tre» for å bygge den interaktive visningen.
Klikk pilen ved siden av et objekt eller en array for å utvide eller kollapse den — noder dypere enn et par nivåer starter automatisk kollapset slik at store filer forblir responsive.
Skriv et nøkkelnavn eller en verdi i søkeboksen for å finne treff; verktøyet utvider hver overordnede node på veien ned og ruller til og markerer resultatet.
Bruk neste/forrige-knappene for å gå gjennom flere treff.

Eksempel

Inndata

{"user":{"id":42,"name":"Ada","roles":["admin","editor"],"active":true,"manager":null}}

Resultat

user: { 4 nøkler }
  id: 42 (tall)
  name: "Ada" (streng)
  roles: [ 2 elementer ]
    0: "admin"
    1: "editor"
  active: true (boolsk)
  manager: null

Hver rad viser nøkkelen, dens utledede type, og enten verdien (for løvnoder) eller et kollapset antall (for objekter og arrayer) inntil du utvider den.

Praktiske tips

For store API-responser, søk etter et distinkt feltnavn først (som en id eller en feilkode) i stedet for å manuelt utvide node for node — søket hopper rett dit.
Noder forbi de første par nivåene starter kollapset med hensikt, slik at en nyttelast på flere megabyte forblir responsiv; utvid bare grenen du trenger.
Typemerker (streng, tall, boolsk, null, objekt, array) er spesielt nyttige for å oppdage et felt som uventet er null eller en array der du forventet et objekt.
Trenger du bare å pynte eller validere et JSON-utdrag i stedet for å utforske strukturen, er JSON-formateringen raskere for den jobben.

Hvor dette passer inn i reelle arbeidsflyter

Dypt nøstede API-responser, databaseeksporter og konfigurasjonsfiler er vanskelige å resonnere om som flat tekst — du mister oversikten over hvilken klammeparentes som tilhører hvilken nøkkel. Å laste den samme nyttelasten inn i en trevisning lar deg kollapse alt du ikke trenger og fokusere bare på grenen som betyr noe, noe som er langt raskere enn å rulle gjennom en formatert tekstvegg på jakt etter ett felt.

En vanlig flyt: lim en stor webhook-nyttelast inn her først for å forstå formen og finne feltet du trenger, bytt deretter til JSON-formateringen hvis du trenger en ren, innrykket tekstkopi å lime inn i en feilrapport eller kodegjennomgang.

→ JSON-formatering

Vanlige bruksområder

Utforske en stor, dypt nøstet API-respons for å finne hvor et spesifikt felt befinner seg før du skriver kode mot det.
Gjennomgå en stor konfigurasjons- eller eksportfil uten å rulle gjennom tusenvis av linjer rå tekst.
Sjekke formen og typene til en ukjent JSON-nyttelast før du tolker den i din egen kode.
Finne en spesifikk verdi (en ID, en feilmelding, et tidsstempel) begravet et sted inne i et stort JSON-dokument.

Ofte stilte spørsmål

Hvordan skiller dette seg fra JSON-formateringsverktøyet?

JSON-formateringen skriver om JSON-tekst med innrykk, minifiserer den, eller validerer syntaks — den jobber på selve teksten. JSON-trevisningen gjengir den tolkede strukturen som et interaktivt, sammenleggbart tre du kan klikke gjennom og søke i — den er bygget for å utforske og forstå formen på store eller dypt nøstede data, ikke for å produsere formatert tekstutdata.

Vil dette fryse nettleseren min på en stor JSON-fil?

Nei. Treet gjengis lazily: bare de første par nivåene bygges når du først gjengir det, og alt dypere konstrueres først i det øyeblikket du klikker for å utvide det. Dette holder den innledende gjengivelsen rask selv for filer på flere megabyte, fordi nettleseren aldri trenger å bygge en DOM-node for data du ikke har sett på ennå.

Blir JSON-dataene mine lastet opp noe sted?

Nei. Tolkning, gjengivelse og søk skjer alt lokalt i nettleseren din med JavaScript. Dataene dine forlater aldri enheten din.

Hvordan fungerer søket?

Søket sjekker hvert nøkkelnavn og hver primitiv verdi i hele den tolkede dataen, ikke bare det som tilfeldigvis er synlig på skjermen. Når det finner et treff, utvider det automatisk hver forfedernode slik at du kan se det, ruller deretter til det og markerer det kort. Er det flere treff, bruk neste/forrige-knappene for å gå gjennom dem.

Kan jeg søke inne i kollapsede noder?

Ja. Søket går alltid gjennom hele den underliggende JSON-objektet, uansett hvilke noder som for øyeblikket er utvidet eller kollapset i visningen. Å kollapse en node påvirker bare det som gjengis på skjermen, ikke det som kan finnes.

JSON-trevisning