Μορφοποιητής JSON: Ωραιοποίηση & Επικύρωση JSON Online Δωρεάν

Τι είναι ένας μορφοποιητής JSON;

Ο μορφοποιητής JSON είναι ένα εργαλείο που λαμβάνει κείμενο JSON (JavaScript Object Notation) και το ξαναγράφει με εσοχές και αλλαγές γραμμής, χωρίς να αλλάζει τα ίδια τα δεδομένα. Το JSON είναι μια μορφή απλού κειμένου για την αποθήκευση και αποστολή δομημένων δεδομένων, η οποία βασίζεται σε ζεύγη ονόματος/τιμής και λίστες. Τα προγράμματα συνήθως εξοικονομούν χώρο αφαιρώντας όλα τα περιττά κενά, με αποτέλεσμα μία πυκνή γραμμή που διαβάζεται δύσκολα από άνθρωπο. Ο μορφοποιητής, που ονομάζεται επίσης beautifier ή pretty printer, προσθέτει ξανά αυτά τα κενά με συνεπή τρόπο, ώστε να είναι ορατή η δομή. Το εργαλείο μορφοποιεί αυτόματα το JSON καθώς αυτό πληκτρολογείται ή επικολλάται. Δεν υπάρχει κουμπί μορφοποίησης· η έξοδος ενημερώνεται σε κάθε πάτημα πλήκτρου. Ένα κουμπί επαναφοράς διαγράφει την είσοδο και ένα κουμπί αντιγραφής αντιγράφει το μορφοποιημένο αποτέλεσμα.

Κανόνες σύνταξης JSON

Το JSON ορίζεται από μια προδιαγραφή που ονομάζεται RFC 8259. Διαθέτει δύο τύπους δοχείων:

Τα αντικείμενα περιέχουν ζεύγη ονόματος-τιμής μέσα σε άγκιστρα:

Οι πίνακες περιέχουν διατεταγμένες λίστες μέσα σε αγκύλες:

Μια τιμή στο JSON πρέπει να είναι ένας από έξι τύπους: συμβολοσειρά, αριθμός, boolean (true ή false), null, αντικείμενο ή πίνακας.

Μερικοί κανόνες προκαλούν τα περισσότερα σφάλματα:

• Τα ονόματα των ιδιοτήτων πρέπει να περικλείονται σε διπλά εισαγωγικά. Το {name: "John"} δεν είναι έγκυρο· πρέπει να είναι {"name": "John"}.
• Οι συμβολοσειρές πρέπει να χρησιμοποιούν διπλά και όχι μονά εισαγωγικά.
• Δεν μπορεί να ακολουθεί κόμμα το τελευταίο στοιχείο ενός αντικειμένου ή πίνακα (δεν επιτρέπονται τελικά κόμματα).
• Το JSON δεν διαθέτει σύνταξη για σχόλια, παρότι η εμφάνισή του με άγκιστρα και αγκύλες προέρχεται από τη JavaScript.
• Το JSON δεν διαθέτει undefined. Για τιμή που λείπει, χρησιμοποιήστε null.

Ένα συνηθισμένο λάθος είναι η επικόλληση ενός literal αντικειμένου JavaScript αντί για JSON. Το {name: 'John', age: undefined} είναι έγκυρη JavaScript αλλά όχι έγκυρο JSON. Η έκδοση JSON είναι {"name": "John", "age": null}.

Πώς λειτουργεί αυτός ο μορφοποιητής JSON

Πολλοί μορφοποιητές JSON περνούν το κείμενο από το JSON.parse() για να δημιουργήσουν ένα αντικείμενο JavaScript και έπειτα εκτελούν JSON.stringify() για να το μετατρέψουν ξανά σε κείμενο με κενά. Αυτή η διαδικασία μετ’ επιστροφής έχει μια παρενέργεια: οι αριθμοί JavaScript είναι αριθμοί κινητής υποδιαστολής διπλής ακρίβειας IEEE 754, οι οποίοι δεν μπορούν να αναπαραστήσουν ακριβώς κάθε ακέραιο μετά το 2^53 − 1 (9,007,199,254,740,991). Ένα αναγνωριστικό όπως το 9007199254740993 μπορεί να προκύψει ως 9007199254740992 μετά από αυτή τη διαδικασία.

Αυτό το εργαλείο παρακάμπτει αυτό το βήμα. Διαβάζει την είσοδο χαρακτήρα προς χαρακτήρα με έναν μικρό, χειρόγραφα γραμμένο αναλυτή και, αντί να μετατρέπει κάθε αριθμό ή συμβολοσειρά σε τιμή JavaScript, αντιγράφει αυτό το τμήμα του κειμένου ακριβώς όπως γράφτηκε και έπειτα το τοποθετεί στο σωστό επίπεδο εσοχής. Επειδή οι αριθμοί δεν μετατρέπονται ποτέ σε αριθμούς κινητής υποδιαστολής, οι ακέραιοι οποιουδήποτε μεγέθους διατηρούν ακριβώς τα ψηφία τους. Αν ένα αντικείμενο έχει γραμμένο το ίδιο κλειδί δύο φορές, διατηρούνται και οι δύο εμφανίσεις στη θέση τους αντί να συγχωνευθούν με την τελευταία, όπως θα συνέβαινε κατά τη δημιουργία αντικειμένου JavaScript.

Η διαδικασία, βήμα προς βήμα:

1. Διαβάζει το επόμενο διακριτικό (αντικείμενο, πίνακα, συμβολοσειρά, αριθμό, true, false ή null).
2. Το ελέγχει σύμφωνα με τη γραμματική JSON. Το απορρίπτει αν παραβιάζει έναν κανόνα, όπως στην περίπτωση κλειδιού χωρίς εισαγωγικά ή τελικού κόμματος.
3. Αντιγράφει το κείμενο του διακριτικού χωρίς αλλαγές στην έξοδο.
4. Προσθέτει αλλαγή γραμμής και εσοχή 2 κενών για κάθε επίπεδο ένθεσης μέσα σε αντικείμενο ή πίνακα. Ένα αντικείμενο ή ένας πίνακας χωρίς περιεχόμενο παραμένει σε μία γραμμή, ως {} ή [].
5. Επαναλαμβάνει τη διαδικασία μέχρι να διαβαστεί ολόκληρη η είσοδος.

Η εσοχή είναι σταθερή και αποτελείται από 2 κενά· δεν υπάρχει ρύθμιση για την αλλαγή της. Όσο το πλαίσιο εισόδου είναι κενό, το πλαίσιο εξόδου εμφανίζει το κείμενο-υπόδειξη «Το μορφοποιημένο JSON θα εμφανιστεί εδώ αυτόματα...». Αν η είσοδος παραβιάζει έναν κανόνα JSON, το εργαλείο εμφανίζει το μήνυμα «Μη έγκυρο JSON: Ελέγξτε την είσοδό σας» αντί για τεχνικό μήνυμα του αναλυτή με την ακριβή θέση του χαρακτήρα. Αντίθετα, η ενσωματωμένη στα προγράμματα περιήγησης JSON.parse() αναφέρει τη θέση χαρακτήρα στο κείμενο του σφάλματος.

Λυμένο παράδειγμα

Αυτή η συμπυκνωμένη είσοδος:

μετατρέπεται σε:

Κάθε ένθετο αντικείμενο ή πίνακας έχει εσοχή κατά ένα επιπλέον επίπεδο σε σχέση με το γονικό του, έτσι ώστε η σχέση μεταξύ του address και των τριών πεδίων του να είναι άμεσα ορατή.

Ένα δεύτερο παράδειγμα δείχνει γιατί έχει σημασία η αντιγραφή των literals. Αυτή η είσοδος:

μορφοποιείται ως:

Τα ψηφία παραμένουν ακριβώς όπως πληκτρολογήθηκαν. Ένας μορφοποιητής που βασίζεται πρώτα στο JSON.parse() και έπειτα στο JSON.stringify() θα μετέτρεπε σιωπηρά αυτόν τον αριθμό σε 9007199254740992.

Συνηθισμένα σφάλματα JSON

• Όνομα ιδιότητας χωρίς εισαγωγικά: {name: "John"}. Διόρθωση: {"name": "John"}.
• Τελικό κόμμα: {"age": 30,}. Διόρθωση: αφαιρέστε το κόμμα πριν από το κλείσιμο του αγκίστρου.
• Ασυμφωνία αγκυλών: {"data": [1, 2}. Διόρθωση: κλείστε τον πίνακα με ] πριν κλείσετε το αντικείμενο.
• Μη κλεισμένη συμβολοσειρά: {"name": "John}. Διόρθωση: προσθέστε το εισαγωγικό που λείπει στο τέλος.
• Μονά εισαγωγικά: {'name': 'John'}. Διόρθωση: χρησιμοποιήστε διπλά εισαγωγικά.
• undefined, NaN ή Infinity: καμία από αυτές τις τιμές δεν είναι έγκυρη στο JSON. Χρησιμοποιήστε null ή μια συμβολοσειρά.

Συχνή πηγή αυτών των σφαλμάτων είναι η απευθείας αντιγραφή ενός αντικειμένου από την κονσόλα ενός προγράμματος περιήγησης ή από ένα αρχείο καταγραφής διακομιστή, τα οποία συχνά περιλαμβάνουν σύνταξη αποκλειστική της JavaScript που πρέπει να καθαριστεί πριν το κείμενο γίνει έγκυρο JSON.

Πότε χρησιμοποιείται ένας μορφοποιητής JSON

Οι μορφοποιητές JSON χρησιμοποιούνται κυρίως για την εξέταση αποκρίσεων API, οι οποίες συνήθως αποστέλλονται σε συμπυκνωμένη μορφή για εξοικονόμηση εύρους ζώνης. Χρησιμοποιούνται επίσης για τον χειροκίνητο έλεγχο αρχείων ρυθμίσεων όπως τα package.json ή composer.json, για την ανάγνωση δεδομένων που αντιγράφηκαν από τον τοπικό χώρο αποθήκευσης ή την κονσόλα ενός προγράμματος περιήγησης και για την κατανόηση της δομής ενός συνόλου δεδομένων που ελήφθη από άλλο σύστημα.

Άλλοι τρόποι μορφοποίησης JSON

• Εργαλεία προγραμματιστών του προγράμματος περιήγησης: τα Chrome, Edge και Firefox μορφοποιούν αυτόματα τις αποκρίσεις JSON στο παράθυρο προεπισκόπησης της καρτέλας Network.
• Επεξεργαστές κώδικα: το Visual Studio Code μορφοποιεί ένα ανοιχτό αρχείο JSON με Alt+Shift+F (Shift+Option+F σε Mac). Οι περισσότεροι επεξεργαστές διαθέτουν αντίστοιχη συντόμευση ή επέκταση μορφοποίησης.
• Γραμμή εντολών: τα jq (jq . file.json) και το ενσωματωμένο στην Python python -m json.tool file.json μορφοποιούν JSON από ένα τερματικό.

Ενσωμάτωση της μορφοποίησης JSON στον κώδικα

Οι περισσότερες γλώσσες προγραμματισμού περιλαμβάνουν βιβλιοθήκη JSON με επιλογή εσοχής. Στη JavaScript:

Στην Python:

Και οι δύο προσεγγίσεις αναλύουν το κείμενο σε εγγενή δομή δεδομένων και στη συνέχεια το επανασειριοποιούν με κενά. Αυτό είναι απλό στην υλοποίηση, αλλά μπορεί να αλλάξει τους αριθμούς. Η JavaScript αποθηκεύει κάθε αριθμό ως αριθμό διπλής ακρίβειας, επομένως το 9007199254740993 επιστρέφει ως 9007199254740992. Η Python διατηρεί τους ακέραιους ακριβείς, επειδή οι ακέραιοι της Python δεν έχουν όριο μεγέθους, αλλά και πάλι ξαναγράφει το 1.0e2 ως 100.0 και μετατρέπει το 1e999 σε Infinity, το οποίο δεν είναι έγκυρο JSON. Οι εφαρμογές που χρειάζονται ακριβείς μεγάλους ακεραίους, όπως τα αναγνωριστικά βάσεων δεδομένων, συχνά τους αποθηκεύουν ως συμβολοσειρές στο JSON και όχι ως αριθμούς.

Σύντομη ιστορία του JSON

Ο Douglas Crockford καθόρισε το JSON στις αρχές της δεκαετίας του 2000, αντλώντας τη σύνταξή του από τα literals αντικειμένων της JavaScript, αλλά καθιστώντας το χρησιμοποιήσιμο από οποιαδήποτε γλώσσα. Το RFC 4627 το τυποποίησε το 2006. Διαδόθηκε γρήγορα επειδή ήταν πιο σύντομο στη γραφή από το XML και αντιστοιχιζόταν άμεσα σε αντικείμενα JavaScript, κάτι που είχε σημασία καθώς οι διαδικτυακές εφαρμογές άρχισαν να λαμβάνουν δεδομένα στο παρασκήνιο αντί να επαναφορτώνουν ολόκληρες σελίδες. Μέχρι τη δεκαετία του 2010 είχε γίνει η προεπιλεγμένη μορφή για REST API και βάσεις δεδομένων όπως η MongoDB.

Συχνές ερωτήσεις

Τι είναι ένας μορφοποιητής JSON; Ένα εργαλείο που προσθέτει εσοχές, αλλαγές γραμμής και κενά στο κείμενο JSON, ώστε η δομή του να διαβάζεται εύκολα, χωρίς να αλλάζει τα δεδομένα.

Η μορφοποίηση αλλάζει τα δεδομένα; Όχι. Η μορφοποίηση αλλάζει μόνο τα κενά. Αυτό το εργαλείο αντιγράφει κάθε συμβολοσειρά και αριθμό ακριβώς όπως πληκτρολογήθηκε, επομένως οι τιμές στη μορφοποιημένη έξοδο αντιστοιχούν απόλυτα στην είσοδο, συμπεριλαμβανομένων αριθμών που είναι υπερβολικά μεγάλοι για να αποθηκευτούν ακριβώς ως αριθμός JavaScript.

Γιατί λαμβάνω σφάλμα «Μη έγκυρο JSON»; Η είσοδος παραβιάζει έναν κανόνα JSON. Συνήθεις αιτίες είναι ονόματα ιδιοτήτων χωρίς εισαγωγικά, ένα τελικό κόμμα, μονά εισαγωγικά, μια μη κλεισμένη συμβολοσειρά ή μια ασύμφωνη αγκύλη. Αυτό το εργαλείο δεν εμφανίζει την ακριβή θέση του προβληματικού χαρακτήρα· ο έλεγχος της εισόδου σύμφωνα με τους παραπάνω κανόνες συνήθως εντοπίζει γρήγορα το πρόβλημα.

Μπορεί το JSON να έχει σχόλια; Όχι. Η προδιαγραφή δεν τα επιτρέπει. Μορφές όπως το JSONC και το JSON5 προσθέτουν υποστήριξη σχολίων πάνω από τη σύνταξη JSON για περιπτώσεις όπου αυτό είναι χρήσιμο, όπως τα αρχεία ρυθμίσεων.

Ποια είναι η τυπική εσοχή JSON; Τα δύο κενά είναι η πιο συνηθισμένη σύμβαση στην ανάπτυξη ιστού και αυτή χρησιμοποιεί το συγκεκριμένο εργαλείο. Ορισμένοι οδηγοί στυλ χρησιμοποιούν αντί για αυτά τέσσερα κενά ή στηλοθέτες· η ίδια η προδιαγραφή JSON δεν απαιτεί συγκεκριμένη εσοχή.

Ποια είναι η διαφορά μεταξύ JSON.parse() και JSON.stringify(); Το JSON.parse() μετατρέπει μια συμβολοσειρά JSON σε τιμή JavaScript. Το JSON.stringify() κάνει το αντίστροφο, μετατρέποντας μια τιμή JavaScript σε συμβολοσειρά JSON, και δέχεται όρισμα εσοχής για καλαίσθητη εκτύπωση. Αυτό το εργαλείο δεν χρησιμοποιεί εσωτερικά καμία από τις δύο συναρτήσεις, γεγονός που του επιτρέπει να διατηρεί ακριβώς τους μεγάλους ακεραίους.

Παραπομπές

1. RFC 8259 — Η μορφή ανταλλαγής δεδομένων JavaScript Object Notation (JSON)
2. MDN Web Docs: JSON
3. json.org