DT Dev Tools

JSON Formatter — Formateur JSON avec vue arborescente

Formatez, validez et minifiez du JSON avec vue arborescente repliable, ligne et colonne exactes des erreurs, tri des clés et prise en charge JSON5/JSONC, en local.

🔒 S'exécute entièrement dans votre navigateur — rien n'est envoyé

Cet outil vous a-t-il été utile ? Notez-le :

Ce que fait JSON Formatter

JSON Formatter valide le JSON pendant la saisie, puis le réécrit soit avec une indentation lisible (2 espaces, 4 espaces ou tabulations), soit sous forme d'une valeur compacte sur une seule ligne. Il est utile pour inspecter des réponses d'API, des métadonnées de paquets, des extraits de configuration, des charges utiles de webhooks, des valeurs de stockage du navigateur et des fixtures de test. Lorsque l'entrée est invalide, l'outil indique la ligne et la colonne exactes, affiche la ligne fautive avec un caret sous le problème et peut placer directement le curseur dessus — les virgules finales, les guillemets manquants et les crochets non appariés sont ainsi trouvés en quelques secondes.

Les documents valides sont aussi présentés sous forme d'arbre repliable. Les objets et les tableaux affichent le nombre de clés ou d'éléments qu'ils contiennent, les enfants ne sont rendus que lorsque vous ouvrez un nœud afin que les gros fichiers restent réactifs, et un clic sur une clé copie son chemin JavaScript, comme $.orders[3].total. Triez les clés par ordre alphabétique pour faciliter la comparaison de deux charges utiles, et ouvrez ou téléchargez directement des fichiers .json. Les fichiers de configuration utilisent souvent JSONC ou JSON5 avec des commentaires, des guillemets simples et des virgules finales ; activez l'option tolérante pour les lire et les convertir en JSON strict.

Un flux de travail privé dans le navigateur

Tout le traitement s'effectue avec du JavaScript dans le navigateur. L'outil n'envoie à aucun serveur vos textes, jetons, URL, extraits ou valeurs générées, et ne demande aucun compte. Ce modèle de confidentialité est important, car les petits utilitaires reçoivent souvent de vraies réponses d'API, des exemples de configuration, des journaux, des données d'authentification ou des exemples proches de données clients lors du dépannage. Travailler en local réduit les risques et rend l'outil instantané, puisqu'il n'y a aucun aller-retour réseau.

Conseils pratiques

Utilisez la mise en forme lisible pour parcourir des données imbriquées et la minification lorsque vous avez besoin d'une valeur compacte pour une variable d'environnement, une fixture ou un exemple de documentation. Le tri des clés ne modifie que l'ordre des propriétés d'un objet, jamais l'ordre des tableaux : il est donc sans risque pour la configuration, mais peut compter si un consommateur dépend de l'ordre des propriétés. Votre brouillon est conservé dans ce navigateur pendant quelques jours, un rechargement accidentel ne le fait donc pas perdre — utilisez Clear lorsque vous travaillez avec des données sensibles. Les très grands nombres, au-delà de la plage d'entiers sûrs de JavaScript, perdent en précision lors de l'analyse, ce qui est une propriété de JSON dans le navigateur et non de cet outil.

Comment utiliser

  1. Coller ou ouvrir du JSONCollez du JSON ou ouvrez un fichier .json ; il est validé pendant la saisie.
  2. Choisir les optionsChoisissez 2 espaces, 4 espaces ou tabulations, le tri des clés, et autorisez JSON5/JSONC si nécessaire.
  3. Formater, explorer et copierMettez en forme ou minifiez, parcourez la vue arborescente, puis copiez ou téléchargez le résultat.

Questions fréquemment posées

Prend-il en charge les commentaires et les virgules finales ?
Oui, en option. Cochez "Autoriser JSON5 / JSONC" pour accepter les commentaires, les virgules finales, les guillemets simples et les clés sans guillemets (comme dans tsconfig.json ou les paramètres de VS Code) ; la sortie est toujours du JSON strict.
Comment trouver une erreur de syntaxe ?
L'état indique la ligne et la colonne de la première erreur, la ligne fautive avec un caret sous le problème, et un bouton «Aller à l'erreur» qui sélectionne cet endroit dans l'éditeur.
Existe-t-il une vue arborescente ?
Oui. Le JSON valide est affiché sous forme d'arbre repliable avec le nombre d'éléments. Cliquez sur une clé pour copier son chemin, par exemple $.users[0].email.
Le JSON est-il envoyé ?
Non. L'analyse et la mise en forme s'effectuent localement dans le navigateur.