Formatage JSON en ligne

Traitement local

app.formatter.view

Vous pouvez aussi injecter des données via #data={"name":"Ada"} ou #url=... Elles sont lues puis retirées de la barre d’adresse.

Dépliez une réponse d’API collée sur une ligne en une structure lisible. Après collage, la syntaxe est validée, le texte indenté, avec option de tri des clés. Tout reste dans l’onglet : utile pour déboguer une charge de production sans l’envoyer à un site tiers. JSON compressé copié du panneau Network, ou ligne unique dans un journal : collez pour voir la hiérarchie.

Embellissement automatique

Objets, tableaux et niveaux d’imbrication sont reconnus, avec indentation 2 / 4 espaces ou Tab. Plus c’est profond, plus l’indentation aligne les champs de même niveau, sans compter les accolades à l’œil.

Effet proche de Prettier / d’un language server, sans créer de fichier ni installer d’extension : pour un coup d’œil sur un corps de réponse.

Contrôle syntaxique

Accolades non appariées, virgule manquante ou en trop : l’outil s’arrête côté saisie et signale l’erreur. Autres cas fréquents : guillemets simples, clés non quotées, virgule finale copiée d’un littéral JS.

Si le texte source est du JSON5 (avec commentaires), convertissez d’abord avec l’outil JSON5, puis revenez formater.

Injection via la barre d’adresse

Utilisez #data={...} ou #url= pour préremplir à l’ouverture ; après lecture, le paramètre est retiré de la barre d’adresse. Pratique pour un lien partageable depuis un ticket, une doc ou un script : le destinataire voit les mêmes données.

Distant #url= Limité par le CORS du navigateur : seuls les fichiers statiques de ce site ou les URL déjà ouvertes au cross-origin peuvent être récupérés.

Exemple

Entrée (compressée)

 {"user":{"id":1001,"name":"Dupont","roles":["admin","editor"]}}

Résultat formaté

{
  "user": {
    "id": 1001,
    "name": "张三",
    "roles": [
      "admin",
      "editor"
    ]
  }
}

Cela modifie-t-il mes valeurs de champs ?

Non. Seuls espaces et sauts de ligne changent ; cocher « Trier les clés » réordonne les clés d’objet, les valeurs restent identiques.

Quelle différence avec l’outil de compression ?

Le formatage sert à la lecture ; Compresser sert au transport. On peut basculer de l’un à l’autre.

Les données sont-elles envoyées ?

Non. Analyse et mise en page restent dans la mémoire du navigateur. Actualiser ou fermer l’onglet efface le contenu.

Quelle taille de fichier convient ?

Quelques Mo restent en général confortables. Au-delà d’environ 2 Mo, ralentissement possible et avertissement ; au-delà de 10 Mo, découpez ou utilisez jq ou un CLI local équivalent.

Flux recommandé

Collez le JSON brut depuis une API, un journal ou le presse-papiers dans la zone gauche, ou cliquez sur « Charger un exemple » pour découvrir l’interface.
Une fois la syntaxe validée, choisissez 2 espaces, 4 espaces ou Tab ; cochez « Trier les clés » si vous devez comparer avec une autre copie.
Utilisez « Copier » pour ramener le résultat dans l’éditeur, un ticket ou un test ; en production, passez par la page de compression pour retirer les blancs.
Pour une structure très profonde, passez à la vue arbre ; pour n’extraire que quelques champs, utilisez JSONPath.

En intégration, prenez l’habitude de « formater pour voir la structure, puis Diff ou YAML » plutôt que d’éditer des champs sur une ligne compressée.