Visionneuse JSON

Utilisez cette visionneuse JSON pour formater et explorer les données en arbre repliable, développer ou replier des nœuds et copier des chemins exacts.

Votre JSON est analysé et affiché localement dans votre navigateur, et rien n'est envoyé à un serveur.

Conçu et maintenu par Udit Agarwal

Besoin de types TypeScript depuis votre JSON ? Essayez l'outil JSON vers TypeScript.

À propos de Visionneuse JSON

Cette visionneuse json vous offre un espace de travail à deux panneaux pour lire et ranger du JSON : modifiez, formatez ou minifiez vos données dans l'onglet Texte, puis passez à l'onglet Visionneuse pour les parcourir sous forme d'arbre repliable. Elle est conçue pour les développeurs, les ingénieurs QA et toute personne qui débogue une réponse d'API et a besoin de voir du json en ligne sans chercher dans un mur de texte. Développez ou repliez les nœuds, plongez dans les objets et tableaux imbriqués, et cliquez sur toute valeur pour copier son chemin exact. En tant que visionneuse d'arbre json, elle fait aussi office de formateur json rapide, vous aidant à embellir des charges utiles minifiées et à repérer la structure d'un coup d'œil. Tout s'exécute entièrement dans votre navigateur, vos données ne quittent jamais votre appareil et rien n'est envoyé à un serveur.

Fonctionnalités

  • Disposition à deux panneaux : un onglet Texte pour modifier et formater, un onglet Visionneuse pour explorer
  • Vue en arbre repliable pour développer et replier les objets et tableaux imbriqués
  • Boutons Tout développer et Tout replier pour remodeler le document entier d'un coup
  • Cliquez sur tout nœud pour voir son chemin complet (par exemple author.links) dans la barre du bas
  • Copiez le chemin d'un nœud en un clic pour l'utiliser dans du code ou des requêtes
  • Formater pour embellir ou Minifier pour compacter du JSON brut dans l'onglet Texte
  • Téléchargez le JSON formaté ou copiez tout le document instantanément
  • Fonctionne entièrement dans votre navigateur, rien n'est envoyé à un serveur

Comment utiliser Visionneuse JSON

  1. Collez ou saisissez votre JSON dans l'onglet Texte.
  2. Cliquez sur Formater pour l'embellir, ou Minifier pour le compacter, et vérifiez qu'il est valide.
  3. Passez à l'onglet Visionneuse pour voir l'arbre repliable.
  4. Utilisez Tout développer ou Tout replier, ou cliquez sur des nœuds individuels pour creuser.
  5. Cliquez sur une valeur et copiez son chemin depuis la barre en bas.

Exemple

Entrée

{"author":{"name":"Ada","links":["site","blog"]}}

Sortie

{
  "author": {
    "name": "Ada",
    "links": [
      "site",
      "blog"
    ]
  }
}

Formaté dans l'onglet Texte ; cliquer sur le premier lien dans la Visionneuse affiche le chemin author.links[0].

Erreurs courantes et dépannage

  • L'onglet Visionneuse est vide ou n'affiche rien à développer. — Vérifiez dans l'onglet Texte une erreur de syntaxe telle qu'une virgule en trop ou une clé sans guillemets ; l'arbre n'affiche que du JSON valide.
  • Un extrait collé a des apostrophes simples ou des clés de style JavaScript. — Le JSON exige des clés et des valeurs de chaîne entre guillemets doubles. Convertissez les apostrophes simples en guillemets doubles avant de visualiser.
  • Un document énorme semble lent à développer. — Utilisez d'abord Tout replier, puis développez seulement les branches dont vous avez besoin au lieu d'ouvrir tous les nœuds à la fois.
  • Vous avez copié un chemin mais il ne correspond pas à votre code. — Les chemins utilisent la notation par points et crochets depuis la racine ; adaptez-les à la syntaxe d'accès de votre langage si elle diffère.

Foire aux questions

À quoi sert la Visionneuse JSON ?
La Visionneuse JSON vous permet de formater, minifier et explorer du JSON sous forme d'arbre repliable, afin de lire des réponses d'API et des fichiers de configuration sans parcourir un mur de texte brut.
Comment obtenir le chemin vers une valeur dans la Visionneuse JSON ?
Cliquez sur tout nœud dans l'onglet Visionneuse et son chemin, par exemple author.links, apparaît dans la barre du bas, prêt à copier.
Puis-je développer ou replier tout l'arbre d'un coup ?
Oui. Utilisez les boutons Tout développer et Tout replier dans la barre d'outils pour remodeler le document entier en un clic.
La Visionneuse JSON formate-t-elle et minifie-t-elle aussi mon JSON ?
Oui. L'onglet Texte embellit ou compacte le JSON brut avec les boutons Formater et Minifier, puis l'onglet Visionneuse l'affiche sous forme d'arbre navigable.
Mon JSON est-il envoyé quelque part lorsque j'utilise la Visionneuse JSON ?
Non. La Visionneuse JSON traite tout localement dans votre navigateur, vos données ne quittent jamais votre appareil et rien n'est envoyé.
Comment la Visionneuse JSON gère-t-elle le JSON invalide ?
L'onglet Visionneuse a besoin de JSON valide pour construire l'arbre ; corrigez les erreurs signalées dans l'onglet Texte, y compris la ligne et la colonne, et l'arbre s'affichera.

Outils associés

  • Formateur JSON — Embellit, minifie et valide le JSON avec la localisation des erreurs.
  • Visionneuse d’arbre JSON — Explorez le JSON sous forme d’arbre repliable et typé.
  • JSON vers TypeScript — Génère des interfaces TypeScript à partir d’un échantillon JSON.
  • JSON vers CSV — Convertit un tableau d’objets JSON plats en CSV.
  • YAML ↔ JSON — Convertit du YAML en JSON et inversement.
  • Formateur XML — Embellit, minifie et valide le XML, et convertit XML ↔ JSON.
  • Comparer du texte — Compare deux textes ligne par ligne et affiche ajouts et suppressions.
  • JSON vers code — Génère des types Go, Rust, Python, Java, Kotlin, C# et TypeScript à partir de JSON.

Plus d’outils JSON

  • JSON vers TypeScript — Génère des interfaces TypeScript à partir d’un échantillon JSON.
  • JSON vers CSV — Convertit un tableau d’objets JSON plats en CSV.
  • Échapper / Déséchapper JSON — Échappe du texte vers une chaîne JSON ou déséchappe une chaîne JSON vers du texte brut.
  • JSON vers code — Génère des types Go, Rust, Python, Java, Kotlin, C# et TypeScript à partir de JSON.
  • JSON Diff — Comparez deux documents JSON et obtenez un diff structurel des modifications.
  • JSON Schema — Générez un JSON Schema depuis un échantillon ou validez un document avec chaque erreur détaillée.
  • JSON Flatten / Unflatten — Aplatissez du JSON imbriqué en clés à notation pointée, ou reconstruisez-le.
  • JSON vers Zod — Générez un schéma Zod à partir d’un exemple JSON, avec les types inférés.
  • JSON vers Pydantic — Générez des classes de modèle Pydantic v2 à partir d’un exemple JSON.
  • Évaluateur JSONPath — Testez une expression JSONPath sur votre JSON et voyez les correspondances en direct.
  • JSON vers TOON — Convertissez du JSON en TOON pour des prompts LLM avec moins de tokens.
  • Bac à sable jq — Collez du JSON, écrivez un filtre jq et voyez le résultat instantanément.

Voir tous les outils JSON (29) · Tous les outils