Comment formater JSON en ligne : guide complet avec des exemples

À l'époque où j'adminify WP était disponible, un ticket d'assistance indiquait simplement : &quot ; L'importation des paramètres est interrompue. Rien ne fonctionne.&quot ; L'utilisateur avait édité manuellement un fichier de paramètres exporté - une virgule de fin à la ligne 217 d'un blob JSON de 9 000 lignes - et mon importateur a répondu avec le world&#39 ; erreur la moins utile : L'importation a échoué

J'ai écrit ce message d'erreur. C'est sur moi.

Il a fallu 40 minutes de va-et-vient aux deux de nos deux pour trouver une virgule qu'un formateur décent aurait signalé en une demi-seconde. Ce billet a changé ma façon de penser à l'outillage JSON, et des années plus tard, il a façonné la façon dont j'ai construit le Formateur JSON Sur Toolz.dev : L'emplacement de l'erreur n'est pas agréable à avoir. C'est l'ensemble du produit.

Ce guide explique comment formater JSON en ligne, pourquoi le formatage échoue et les pièges syntaxiques qui mangent tout le monde et le n°39 ; l'après-midi finit par - y compris le mien.

tl;dr : Pour formater JSON Online, collez-le dans un outil côté client comme le Formateur JSON Toolz.dev- il s'imprime assez instantanément, signale les erreurs de syntaxe avec les numéros de ligne et ne télécharge jamais vos données. Si le formatage échoue, vous avez presque certainement une virgule de fin, des guillemets simples ou une clé non cotée. Utilisez l'indentation à 2 espaces, sauf indication contraire de votre équipe.

Que fait "formatage JSON" ?

Formatage - jolie impression, si vous et #39 ; vous sentez fantaisie - ajoute l'indentation et les sauts de ligne pour que la structure devienne visible Les données ne changent pas d'un seul bit. It&#39 ; est une transformation de présentation, rien de plus.

ceci :

{"employees":[{"firstName":"John","lastName":"Doe","department":"Engineering","skills":["JavaScript","Python","Docker"]},{"firstName":"Jane","lastName":"Smith","department":"Design","skills":["Figma","CSS","Illustration"]}],"company":"Acme Corp","founded":2015}

devient ceci :

{
  "employees": [
    {
      "firstName": "John",
      "lastName": "Doe",
      "department": "Engineering",
      "skills": ["JavaScript", "Python", "Docker"]
    },
    {
      "firstName": "Jane",
      "lastName": "Smith",
      "department": "Design",
      "skills": ["Figma", "CSS", "Illustration"]
    }
  ],
  "company": "Acme Corp",
  "founded": 2015
}

des données identiques. Mais un seul d'entre eux vous permet de repérer en un coup d'œil que Jane est en conception.

Il y a un bonus auquel la plupart des gens ne pensent pas : le formatage est également une validation déguisée. Un formateur doit analyser votre document pour le reformater, donc si le JSON est cassé, un bon formateur vous le dit alors que- qui est la véritable raison d’en utiliser un au lieu de plisser les yeux.

Comment formater JSON en ligne dans la pratique ?

L'ensemble du workflow est d'une quinzaine de secondes :

1. Copiez le JSON de partout où il vit - Onglet DevTools Network (cliquez avec le bouton droit sur une demande → Copier la réponse), curl sortie, un fichier journal, un message de Slack d'un collègue.
2. Ouvrez le Formateur JSON. Pas d'inscription, pas de connexion. Il se charge et vous collez.
3. Lisez la sortie. Le JSON valide revient en retrait et en surbrillance syntaxique, avec des sections pliables pour les gros documents. Le JSON non valide obtient une erreur avec un numéro de ligne et une description en anglais simple.
4. copier ou télécharger. Un clic dans les deux sens.

C'est ça et c'est ça. La partie intéressante est & #39 ; le chemin heureux - c'est & #39 ; c'est l'étape 3 quand les choses tournent mal. Alors laissez & #39 ; va mal.

Pourquoi mon JSON ne se formate-t-il pas ?

Si un formateur refuse votre JSON, le document viole la grammaire dans RFC 8259. D'après mon expérience - à la fois à partir de mon propre débogage et de la création de l'outil dans lequel les gens collent leur JSON cassé - it&#39 ; c'est presque toujours l'une des cinq choses suivantes.

1. virgule de suivi

{
  "name": "Alice",
  "age": 30,
}

SyntaxError: Unexpected token } in JSON at position 34

Javascript permet cela. JSON n'a jamais. Supprimez la virgule après le dernier élément de chaque objet et tableau :

{
  "name": "Alice",
  "age": 30
}

Ceci est ma virgule de support. respectez-le.

2. Citations uniques

{ 'name': 'Alice' }

Le Python classique dit. str(my_dict) produit un pseudo-JSON à guillemet simple; json.dumps(my_dict) produit la vraie chose Si vous et n°39 ; voyez des citations uniques dans quelque chose prétendant être JSON, quelqu'un a imprimé un dict au lieu de le sérialiser - I et n°39 ; je l'ai fait, vous et n°39 ; je l'ai fait, nous et n°39 ; je recommencerai tous.

{ "name": "Alice" }

3. Backslash non échappé

{ "path": "C:\new\test" }

semble inoffensif. mais \n est une nouvelle ligne et \t est un onglet, donc cela s'analyse dans un chemin avec de véritables sauts de ligne - ou échoue carrément sur des séquences comme \x. Les chemins d'accès Windows sont la victime numéro un :

{ "path": "C:\\new\\test" }

4. Supports non assortis

{
  "users": [
    {"name": "Alice"},
    {"name": "Bob"}
}

absent ]. Trivial ici, brutal dans une configuration imbriquée à six niveaux de profondeur. Il s'agit d'une catégorie d'erreurs que les humains sont vraiment mauvais pour trouver et que les analyseurs trouvent instantanément - sous-traitez-la.

5. valeurs JavaScript qui ne sont pas JSON

{ "value": undefined, "count": NaN }

undefined, NaN, et Infinity sont Javascript, pas JSON. JSON.stringify convertit tranquillement NaN à null et gouttes undefined propriétés entièrement - ce qui signifie que le bug est souvent & #39 ; t dans le JSON you& #39 ;re looking, it& #39 ; s en amont dans tout ce qui l'a produit Utiliser null explicitement et vérifiez votre sérialiseur.

le formateur Attrape les cinq avec le numéro de ligne joint. Cette dernière phrase est la raison pour laquelle cette catégorie d'outil existe.

Faut-il utiliser 2 espaces, 4 espaces ou onglets ?

Le débat éternel, édition JSON. Voici la comparaison honnête :

Ma position, et je mourrai sur cette petite colline : 2 espaces pour JSON, quel que soit votre autre code. JSON niche plus profondément que le code source typique - les réponses API à quatre et cinq niveaux de profondeur sont normales - et l'indentation à 4 espaces les transforme en exercices de défilement horizontal. Même dans les équipes lourdes en Python, j'ai réglé JSON sur 2 espaces et personne ne s'est jamais plaint deux fois.

Quoi que vous choisissiez, encodez-le pour que le débat se termine :

# .editorconfig
[*.json]
indent_style = space
indent_size = 2
insert_final_newline = true

le formateur Prend en charge les deux largeurs, donc correspondre à la convention de votre projet est une liste déroulante, pas une discussion.

Qu'en est-il du formatage à partir de la ligne de commande ?

Parfois, le terminal est plus proche qu'un onglet de navigateur. Mon utilisation réelle :

# jq — the standard. Install it, learn 10% of it, profit.
curl -s https://api.example.com/users | jq .

# Python — already on basically every machine
curl -s https://api.example.com/users | python -m json.tool

# Node, if you enjoy typing
node -e "console.log(JSON.stringify(JSON.parse(require('fs').readFileSync(0,'utf8')),null,2))" < data.json

Où chacun gagne, honnêtement :

• JQ pour tout ce qui est scénarisé, répété ou tuyauté - et pour extraire des champs (jq '.data.users[].email') plutôt que de lire des documents entiers.
• L'outil de navigation pour les ponctuels, pour tout ce que vous voulez explorer avec des sections pliables et pour afficher un coéquipier - vous pouvez partager une expression jq avec un chef de projet.
• VS Code (Shift+Alt+F) pour les fichiers JSON qui vivent dans le référentiel et sont ouverts de toute façon.

J'utilise les trois tous les jours. Quiconque vous dit que l'un remplace les autres vend quelque chose.

Une habitude qui vaut la peine d'être volée : curl -s ... > response.json premier, puis formatez le fichier. Lorsque la réponse s'avère être une page d'erreur HTML portant un Content-Type: application/json costume - arrive plus que n'importe lequel d'entre nous ne le souhaiterait - vous et n°39 ; je voudrai les octets originaux, pas votre navigateur et n°39 ; son interprétation.

Trois techniques de formatage La plupart des gens sautent

Trier les clés par ordre alphabétique. Différents sérialiseurs émettent des clés dans différentes commandes, ce qui fait que les données "mêmes" ressemblent à des réécritures. Les clés de tri avant de différer transforment un différentiel de 300 lignes en 2 lignes qui ont réellement changé. Cela se marie à merveille avec le Outil de diff de texte lorsque vous comparez les charges utiles de mise en scène et de production - une astuce qui m'a personnellement sauvé lors d'au moins deux incidents.

Gardez les tableaux courts en ligne. "colors": ["red", "green", "blue"] Sur une ligne, on lit mieux que cinq lignes de cérémonie. De bons formateurs le font automatiquement pour les tableaux de primitives, c'est la différence entre le format JSON formaté, vous pouvez survoler et formater JSON qui est techniquement jolie mais 4 000 lignes.

Formatez le fragment, pas le fichier. Pour un document de 15 Mo lorsque vous ne vous souciez que d'un seul objet : copiez cet objet imbriqué, formatez-le seul, terminé. Formater l'ensemble du fichier pour pouvoir en lire 40 lignes est un effort inutile - mais si vous avez besoin de l'ensemble, un outil côté client le gère sans barre de progression de téléchargement, car il n'y a pas de téléchargement.

et savoir quand non Au format : JSON minifié dans les bundles de production et les réponses API doivent rester minimisés. Le formatage est pour les yeux, pas pour les fils. Si vous avez besoin de la direction opposée, la même chose outil Réduit en un clic.

Questions fréquentes

Comment formater gratuitement JSON en ligne ?

Collez votre JSON dans le Formateur JSON Toolz.dev- il se formate instantanément avec coloration syntaxique et vérification des erreurs, gratuit, pas d'inscription Le traitement se passe dans votre navigateur, donc rien de ce que vous collez n'est téléchargé nulle part Cette dernière partie compte plus que le &quot ; free&quot ; partie si la charge utile contient des jetons ou des données utilisateur.

Pourquoi mon JSON ne se formate-t-il pas correctement ?

Le document a une erreur de syntaxe, et les principaux suspects sont des virgules de fin, des citations uniques, des clés non citées, des barres obliques inverses non échappées et des crochets non appariés Un formateur qui valide pointera sur la ligne exacte Si l'erreur n'a aucun sens, vérifiez si vous avez réellement JSON du tout - les API adorent retourner des pages d'erreur HTML avec un type de contenu JSON.

Quelle est la différence entre le formatage et la validation de JSON ?

Le formatage réécrit les espaces pour en vérifier la lisibilité ; la validation vérifie le document par rapport à la grammaire RFC 8259. En pratique, ils et n°39 ; sont la même opération - un formateur doit analyser (valider) avant de pouvoir reformater. That&#39 ;s pourquoi &quot ; il a gagné&#39 ; t format&quot ; et &quot ;it&#39 ;s invalide&quot ; sont le même diagnostic.

Dois-je utiliser 2 ou 4 espaces pour l'indentation JSON ?

Utilisez 2 espaces, sauf si votre projet est déjà normalisé sur 4. JSON nest plus profond que la plupart des codes sources, et l'indentation à 2 espaces permet de les rendre lisibles dans le monde réel sans défilement horizontal. Verrouillez ensuite le choix dans .editorconfig Donc, il ne revient plus jamais dans la révision du code.

Puis-je formater JSON en code VS sans extension ?

Oui - Shift+Alt+F (ou Shift+Option+F Sur Mac) formate n'importe quel fichier JSON avec le formateur intégré et "format sur enregistrer" le rend automatique. Notez que VS Code Own settings.json est JSONC, qui permet les commentaires - don&#39 ; laissez cela vous convaincre que JSON est un habitué.

Est-il sûr de coller des réponses API dans les formateurs JSON en ligne ?

Uniquement sur ceux côté client. Beaucoup de sites de formatage PUBLIENT votre entrée sur un serveur, ce qui signifie que votre réponse API - jetons, e-mails, tout cela - existe désormais dans quelqu'un d'autre et dans les journaux n°39 ; Le Formateur Toolz.dev S'exécute entièrement dans votre navigateur, vérifiez-le vous-même en regardant l'onglet Réseau pendant que vous collez.

Comment formater un énorme fichier JSON (10 Mo+) ?

Les outils de navigation côté client gèrent bien les fichiers de cette plage puisque là-bas et #39 ; n'est pas une étape de téléchargement - le collage est la partie lente. Au-delà de 50 Mo environ, passez aux outils de streaming : jq Sur la ligne de commande, ou extraire la section dont vous avez besoin et formatez-la. Ne collez jamais d'énormes fichiers dans des outils basés sur le serveur, vous attendez un téléchargement sans aucun avantage.

Comment minimiser JSON au lieu de le formater ?

Même outil, bouton opposé - le Formateur JSON A un mode Minify en un clic qui supprime tous les espaces blancs. Minify pour les charges utiles de production, la stockage local et les pipelines de journaux ; format pour les humains. Les données sont identiques dans les deux sens.

Le formatage JSON modifie-t-il les données ?

Non - le formatage réécrit uniquement les espaces, de sorte que les clés, les valeurs et la structure restent identiques dans leur sens. Un document formaté et sa version minifiée s'analysent exactement sur le même objet. Si vos données changent réellement, vous avez modifié quelque chose à la main plutôt que de simplement formater.

Qu'est-ce qu'un embellisseur JSON ?

It&#39 ;s un autre nom pour un formateur JSON - un outil qui prend JSON minifié ou désordonné et ajoute l'indentation et les sauts de ligne pour qu'un humain puisse le lire. &quot ; Embellir,&quot ; &quot ; pretty-print,&quot ; et &quot ; format&quot ; tous décrivent la même opération. Le Formateur JSON Le fait-il en une seule pâte.

La quinze secondes

Formater JSON est une petite compétence avec des rendements démesurés - la plupart &quot ; l'API est cassée&quot ; les moments sont vraiment &quot ; la charge utile est illisible&quot ; moments, et ceux-ci se dissolvent à la seconde où la structure devient visible Faites descendre la boucle de lecture au format pâte à quinze secondes et toute une catégorie de friction de débogage disparaît.

le Formateur JSON sur Toolz.dev Est-ce la version de cet outil que je voulais lors de ce ticket de support : instantané, précis sur les erreurs et incapable de divulguer vos données car ils ne les reçoivent jamais.

Une fois votre JSON propre, l'étape suivante consiste généralement à le déplacer quelque part - dans une feuille de calcul avec le Convertisseur JSON en CSV, reculez d'un seul avec le Convertisseur CSV en JSON, ou dans un pipeline de configuration via le Validateur de YAML. Commencez par le Guide JSON vers CSV ou remonter au Guide complet des outils JSON Pour la carte complète.

Articles connexes :

• Le guide ultime des outils JSON (2026)
• Conversion JSON en CSV : 5 méthodes utilisées par les développeurs en 2026
• Guide d'outils de texte en ligne gratuit