Formattatore JSON: Abbellisci e Convalida JSON Online Gratuitamente

Che cos'è un formattatore JSON?

Un formattatore JSON è uno strumento che prende il testo JSON e lo riscrive con rientri e interruzioni di riga, senza modificare i dati. JSON, acronimo di JavaScript Object Notation, è un formato di testo semplice per memorizzare e trasferire dati strutturati, composto da coppie nome/valore ed elenchi. Di solito i programmi risparmiano spazio rimuovendo tutti gli spazi superflui, producendo un'unica riga compatta difficile da leggere per una persona. Un formattatore, chiamato anche beautifier o pretty printer, aggiunge nuovamente gli spazi in modo uniforme, così la struttura diventa visibile. Questo strumento formatta automaticamente il JSON mentre viene digitato o incollato. Non esiste un pulsante di formattazione: l'output si aggiorna a ogni pressione di un tasto. Un pulsante di reimpostazione cancella l'input e un pulsante di copia copia il risultato formattato.

Regole della sintassi JSON

JSON è definito da una specifica chiamata RFC 8259. Contiene due tipi di contenitori:

Gli oggetti contengono coppie nome/valore racchiuse tra parentesi graffe:

Gli array contengono elenchi ordinati racchiusi tra parentesi quadre:

Un valore JSON deve essere di uno dei sei tipi seguenti: stringa, numero, valore booleano (true o false), null, oggetto o array.

Alcune regole causano la maggior parte degli errori:

• I nomi delle proprietà devono essere racchiusi tra virgolette doppie. {name: "John"} non è valido; deve essere {"name": "John"}.
• Le stringhe devono usare virgolette doppie, non virgolette singole.
• Non può esserci una virgola dopo l'ultimo elemento di un oggetto o di un array: le virgole finali non sono ammesse.
• JSON non ha una sintassi per i commenti, anche se l'aspetto con parentesi graffe e quadre deriva da JavaScript.
• JSON non ha il valore undefined. Per un valore mancante si usa null.

Un errore comune consiste nell'incollare un literal di oggetto JavaScript invece di JSON. {name: 'John', age: undefined} è JavaScript valido, ma non JSON valido. La versione JSON è {"name": "John", "age": null}.

Come funziona questo formattatore JSON

Molti formattatori JSON passano il testo a JSON.parse() per creare un oggetto JavaScript, quindi usano JSON.stringify() per trasformarlo nuovamente in testo con gli spazi appropriati. Questo percorso di andata e ritorno ha un effetto collaterale: i numeri JavaScript sono valori a virgola mobile a doppia precisione IEEE 754, che non possono rappresentare esattamente tutti gli interi oltre 2^53 − 1 (9.007.199.254.740.991). Un ID come 9007199254740993 può diventare 9007199254740992 dopo questo passaggio.

Questo strumento evita tale passaggio. Legge l'input carattere per carattere con un piccolo parser scritto appositamente e, invece di convertire ogni numero o stringa in un valore JavaScript, copia quella parte di testo esattamente come è stata scritta, quindi la colloca al livello di rientro corretto. Poiché i numeri non vengono mai convertiti in valori a virgola mobile, gli interi di qualsiasi dimensione conservano le cifre esatte. Se una chiave è scritta due volte nello stesso oggetto, entrambe le copie vengono mantenute nella loro posizione invece di essere riunite nell'ultima, come accadrebbe creando un oggetto JavaScript.

Il processo, passo per passo:

1. Legge il token successivo: un oggetto, un array, una stringa, un numero, true, false o null.
2. Lo verifica rispetto alla grammatica JSON. Lo rifiuta se viola una regola, per esempio usando una chiave senza virgolette o una virgola finale.
3. Copia il testo del token senza modificarlo nell'output.
4. Aggiunge un'interruzione di riga e un rientro di 2 spazi per ogni livello di annidamento all'interno di un oggetto o di un array. Un oggetto o un array vuoto rimane su una sola riga, come {} o [].
5. Ripete l'operazione finché non ha letto tutto l'input.

Il rientro è fisso a 2 spazi e non esiste un'impostazione per modificarlo. Quando la casella di input è vuota, il pannello di output mostra il testo segnaposto «Il JSON formattato apparirà qui automaticamente...». Se l'input viola una regola JSON, lo strumento mostra il messaggio «JSON non valido: controlla l'input» invece di un messaggio tecnico del parser con la posizione esatta del carattere. Al contrario, JSON.parse() integrato nei browser indica la posizione del carattere nel testo dell'errore.

Esempio pratico

Questo input minimizzato:

diventa:

Ogni oggetto o array annidato ha un livello di rientro in più rispetto al contenitore principale, quindi la relazione tra address e i suoi tre campi è visibile immediatamente.

Un secondo esempio mostra perché è importante copiare i literal. Questo input:

viene formattato così:

Le cifre restano esattamente quelle digitate. Un formattatore basato su JSON.parse() seguito da JSON.stringify() trasformerebbe invece silenziosamente quel numero in 9007199254740992.

Errori JSON comuni

• Nome della proprietà senza virgolette: {name: "John"}. Correzione: {"name": "John"}.
• Virgola finale: {"age": 30,}. Correzione: rimuovere la virgola prima della parentesi graffa di chiusura.
• Parentesi non corrispondenti: {"data": [1, 2}. Correzione: chiudere l'array con ] prima di chiudere l'oggetto.
• Stringa non chiusa: {"name": "John}. Correzione: aggiungere la virgoletta di chiusura mancante.
• Virgolette singole: {'name': 'John'}. Correzione: usare le virgolette doppie.
• undefined, NaN o Infinity: nessuno di questi è un valore JSON valido. Usare null o una stringa.

Una fonte frequente di questi errori è copiare un oggetto direttamente dalla console del browser o da un log del server. Spesso questi contenuti includono una sintassi esclusiva di JavaScript, che deve essere ripulita prima che il testo diventi JSON valido.

Quando usare un formattatore JSON

I formattatori JSON vengono usati soprattutto per esaminare le risposte delle API, che di solito vengono inviate in forma minimizzata per ridurre il consumo di banda. Servono anche per controllare manualmente file di configurazione come package.json o composer.json, leggere dati copiati dalla memoria locale o dalla console di un browser e comprendere la struttura di un insieme di dati ricevuto da un altro sistema.

Altri modi per formattare JSON

• Strumenti per sviluppatori del browser: Chrome, Edge e Firefox formattano automaticamente le risposte JSON nel riquadro di anteprima della scheda Rete.
• Editor di codice: Visual Studio Code formatta un file JSON aperto con Alt+Shift+F (Shift+Option+F su Mac). La maggior parte degli editor offre una scorciatoia equivalente o un'estensione per la formattazione.
• Riga di comando: jq (jq . file.json) e il modulo integrato di Python python -m json.tool file.json formattano entrambi il JSON dal terminale.

Integrare la formattazione JSON nel codice

La maggior parte dei linguaggi di programmazione include una libreria JSON con un'opzione per il rientro. In JavaScript:

In Python:

Entrambi gli approcci analizzano il testo trasformandolo in una struttura di dati nativa, quindi lo serializzano nuovamente con gli spazi. È semplice da scrivere, ma può modificare i numeri. JavaScript memorizza ogni numero come un valore a doppia precisione, quindi 9007199254740993 torna come 9007199254740992. Python mantiene esatti i numeri interi, perché gli interi Python non hanno un limite di dimensione, ma riscrive comunque 1.0e2 come 100.0 e trasforma 1e999 in Infinity, che non è JSON valido. Le applicazioni che devono conservare interi grandi in modo esatto, come gli ID dei database, spesso li memorizzano come stringhe nel JSON invece che come numeri.

Una breve storia di JSON

Douglas Crockford ha definito JSON nei primi anni 2000, traendo la sintassi dai literal di oggetto JavaScript ma rendendola utilizzabile da qualsiasi linguaggio. La RFC 4627 lo ha formalizzato nel 2006. Si è diffuso rapidamente perché era più breve da scrivere rispetto a XML e si associava direttamente agli oggetti JavaScript, un aspetto importante quando le applicazioni web hanno iniziato a recuperare dati in background invece di ricaricare intere pagine. Negli anni 2010 era diventato il formato predefinito per le API REST e per database come MongoDB.

Domande frequenti

Che cos'è un formattatore JSON?
È uno strumento che aggiunge rientri, interruzioni di riga e spazi al testo JSON, così la sua struttura è facile da leggere senza modificare i dati.

La formattazione modifica i dati?
No. La formattazione modifica solo gli spazi. Questo strumento copia ogni stringa e ogni numero esattamente come sono stati digitati, quindi i valori nell'output formattato corrispondono con precisione all'input, compresi i numeri troppo grandi per essere memorizzati esattamente come numeri JavaScript.

Perché ricevo un errore «JSON non valido»?
L'input viola una regola JSON. Le cause comuni sono nomi di proprietà senza virgolette, una virgola finale, virgolette singole, una stringa non chiusa o una parentesi non corrispondente. Questo strumento non mostra la posizione esatta del carattere problematico; confrontare l'input con le regole elencate sopra di solito permette di trovarlo rapidamente.

JSON può contenere commenti?
No. La specifica non li ammette. Formati come JSONC e JSON5 aggiungono il supporto ai commenti alla sintassi JSON nei casi in cui è utile, per esempio nei file di configurazione.

Qual è il rientro JSON standard?
Due spazi sono la convenzione più comune nello sviluppo web ed è quella utilizzata da questo strumento. Alcune guide di stile usano invece quattro spazi o tabulazioni; la specifica JSON non impone un rientro particolare.

Qual è la differenza tra JSON.parse() e JSON.stringify()?
JSON.parse() trasforma una stringa JSON in un valore JavaScript. JSON.stringify() fa l'operazione inversa, trasformando un valore JavaScript in una stringa JSON, e accetta un argomento per il rientro e la stampa formattata. Questo strumento non usa internamente nessuna delle due funzioni, e per questo riesce a conservare esattamente gli interi grandi.

Riferimenti

1. RFC 8259 — The JavaScript Object Notation (JSON) Data Interchange Format
2. MDN Web Docs: JSON
3. json.org