Visionneuse JSON

Collez du JSON et parcourez-le comme un arbre, le chemin de chaque valeur a un clic de votre presse-papiers.

Entree

Arbre

Sensible a la casse Regex Dans

Apercu des images

Charge chaque image directement depuis sa propre URL quand c est active. C est la seule fonctionnalite de cette page qui charge quoi que ce soit depuis l exterieur de votre navigateur.

L arbre apparait ici.

Chemin Selectionnez une valeur dans l arbre pour voir son chemin

Actions du sous-arbre

Tout fonctionne dans votre navigateur. Rien de ce que vous collez n est envoye, et vous pouvez le verifier dans l onglet Reseau de votre navigateur.

A propos de cet outil

L arbre est construit a partir du meme flux de jetons que celui imprime par le formateur, donc ce que vous voyez est ce que votre document dit vraiment: un entier de vingt chiffres garde tous ses chiffres, et les cles qui ressemblent a des nombres gardent l ordre dans lequel vous les avez ecrites. Chaque branche est dessinee au moment ou vous l ouvrez et non toutes d un coup, ce qui garde un gros document reactif au lieu de figer l onglet pendant que dix mille lignes se mettent en place. Selectionner une valeur affiche son chemin et met en evidence dans l editeur le texte source dont elle vient, si bien que passer de la forme d un document a son texte ne demande plus de compter les crochets a la main. Une vue en graphe dessine le meme arbre sous forme de noeuds et de lignes de connexion, pour un document ou les relations entre les valeurs comptent plus que l ordre dans lequel elles ont ete ecrites. Une vue en tableau lit plutot un tableau d objets comme une grille, avec des colonnes triables, un choix des colonnes visibles, un clic pour copier n importe quelle cellule, et un bouton Exporter en CSV, pour le cas tout aussi courant ou le document est deja une liste d enregistrements et ou un tableur est la facon naturelle de le regarder.

Comment ca marche

Collez votre JSON dans l'éditeur à gauche, ou chargez l'exemple.
L arbre est dessine des que vous arretez de taper. Ouvrez une branche pour voir ce qu elle contient.
Selectionnez une valeur pour voir son chemin et la mettre en evidence dans l editeur, puis copiez le chemin en un bouton.

Questions frequentes

Quelle taille de document cet outil accepte-t-il?

De gros documents, car une branche n est dessinee que lorsque vous l ouvrez. Un document de cent mille valeurs coute autant a afficher qu un petit tant que vous ne commencez pas a l ouvrir. La seule limite reelle porte sur Tout deplier, qui refuse au dela de quelques milliers de valeurs et le dit, plutot que de bloquer l onglet pendant une minute. La coloration de l editeur se desactive aussi au dela de quelques centaines de milliers de caracteres, et la page vous le signale.

Que signifient les chemins?

Ce sont des expressions JSONPath. Le signe dollar designe le document entier, un point nomme une cle d objet et les crochets contiennent un indice de tableau. Une cle qui ne peut pas suivre un point, parce qu elle contient une espace ou commence par un chiffre, s ecrit entre crochets et guillemets. Tout outil qui accepte JSONPath les comprend, et elles se lisent comme un acces d attribut ordinaire dans la plupart des langages.

La visionneuse modifie-t-elle mes donnees?

Non, et elle va plus loin: elle ne transforme jamais votre document en valeur JavaScript. Elle lit le flux de jetons, donc le texte affiche a cote de chaque cle est caractere pour caractere celui que vous avez colle. Les visionneuses baties sur JSON.parse arrondissent discretement les nombres longs et reordonnent les cles numeriques avant meme le premier affichage, si bien que l arbre montre n est pas tout a fait votre document.

Que montre la vue en graphe, et dessine-t-elle tout le document?

Chaque noeud est une valeur de votre document et chaque ligne le relie a l objet ou au tableau auquel il appartient, disposes de haut en bas selon la profondeur plutot que par une simulation physique, si bien que le meme document se dessine toujours de la meme facon. Au dela de 400 noeuds, elle dessine les 400 premiers dans l ordre du document et le signale, plutot que de figer l onglet en essayant de tout disposer d un coup. La vue en arbre n a pas cette limite, revenez-y pour voir le reste d un document aussi grand.

Que montre la vue en tableau, et que devient une valeur qu elle ne peut pas dessiner comme cellule?

Elle lit un document de la meme facon que Exporter en CSV: un tableau d objets devient une ligne par objet, et un seul objet devient un tableau d une ligne. Tout le reste, un tableau qui melange des objets avec d autres valeurs ou un document qui n est ni un tableau ni un objet, n est pas dessine comme un tableau; la page le dit clairement et les vues arbre ou graphe continuent de le montrer correctement. Un objet ou un tableau imbrique dans une cellule n a pas de forme plate, il est donc affiche sous forme de son propre texte JSON compact plutot que laisse vide, et copier cette cellule copie ce meme texte. Trier, masquer une colonne et copier une cellule ne changent jamais votre document, seulement l apparence de cette vue.

Visionneuse JSON

Raccourcis clavier

Donnees locales

Fichiers ouverts recemment

Partager via un lien

Ouvrir le lien partage dans

Entree

Charger depuis une URL

Arbre

A propos de cet outil

Comment ca marche