Γιατί το JSON.parse λέει "Unexpected token";

Αυτό είναι διάγνωση Unexpected token στο JSON.parse: τι σημαίνει το σφάλμα, πώς να διαβάσετε τη θέση και τι να κάνετε όταν το σώμα είναι HTML. Ευρύτερη κάλυψη τελικού κόμματος, εισαγωγικών και Unexpected end υπάρχει στο Συνηθισμένα σφάλματα JSON: τελικό κόμμα, εισαγωγικά και Unexpected token.

Τι σημαίνει “Unexpected token” στο JSON.parse();

Το JSON.parse() απαιτεί γραμματική JSON. Ένας παράνομος χαρακτήρας στην τρέχουσα θέση ρίχνει SyntaxError. Το {“name”:“Alex”,} είναι μη έγκυρο: μετά από εκείνο το κόμμα το αντικείμενο δεν μπορεί να τελειώσει. Το κείμενο μηνύματος και η θέση εξακολουθούν να διαφέρουν ανά χρόνο εκτέλεσης.

Ποιο σφάλμα ρίχνει το JSON.parse();

Το μη έγκυρο JSON συνήθως ρίχνει SyntaxError. Καταγράψτε το error.name για να επιβεβαιώσετε τον τύπο. Μην κωδικοποιείτε σταθερά ολόκληρο το error.message: κινητήρες και εκδόσεις το διατυπώνουν διαφορετικά.

try {
  JSON.parse('{"name":"Alex",}');
} catch (error) {
  console.log(error.name);
  // SyntaxError
}

1. Μονά εισαγωγικά αντί για διπλά

Το {‘name’:‘Alex’} είναι μη έγκυρο JSON. Το {“name”:“Alex”} είναι έγκυρο. Οι συμβολοσειρές JSON και τα ονόματα μελών αντικειμένου χρησιμοποιούν διπλά εισαγωγικά. Ένα κυριολεκτικό αντικείμενο JavaScript όπως const user = { name: ‘Alex’ } μπορεί να είναι νόμιμη JavaScript και πάλι να μην είναι κείμενο JSON.

Μη έγκυρο

{'name':'Alex'}

Έγκυρο

{"name":"Alex"}

2. Τελικά κόμματα

Ένα κόμμα μετά την τελευταία ιδιότητα ή το τελευταίο στοιχείο πίνακα δεν είναι έγκυρο τυπικό JSON. Το {“name”:“Alex”,“age”:30,} και το [1, 2, 3,] αποτυγχάνουν και τα δύο. Θεωρήστε το μία αιτία Unexpected token· το Συνηθισμένα σφάλματα JSON: τελικό κόμμα, εισαγωγικά και Unexpected token καλύπτει το τελικό κόμμα σε μεγαλύτερο βάθος.

Μη έγκυρο

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

Έγκυρο

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

[1, 2, 3,]

3. Ονόματα ιδιοτήτων χωρίς εισαγωγικά

Το { name: “Alex” } μπορεί να είναι κυριολεκτικό αντικείμενο JavaScript. Στο JSON τα ονόματα μελών είναι συμβολοσειρές και χρειάζονται διπλά εισαγωγικά: {“name”:“Alex”}.

Μη έγκυρο

{
  name: "Alex"
}

Έγκυρο

{
  "name": "Alex"
}

4. Μη έγκυρο escape συμβολοσειράς

Στο κείμενο JSON μια ανάστροφη κάθετος ξεκινά escape. Μια ακατέργαστη διαδρομή όπως C:\Users\Alex είναι μη έγκυρη γιατί το \U δεν είναι νόμιμο escape. Διπλασιάστε τις ανάστροφες καθέτους. Μην ανακατεύετε το escape της γλώσσας-ξενιστή με το escape JSON. Το Συνηθισμένα σφάλματα JSON: τελικό κόμμα, εισαγωγικά και Unexpected token το καλύπτει σε μεγαλύτερο βάθος.

Μη έγκυρο

{"file":"C:\Users\Alex"}

Έγκυρο

{"file":"C:\\Users\\Alex"}

5. Επιπλέον κείμενο πριν ή μετά το JSON

Το JSON.parse περιμένει μία τιμή JSON. Ένα πρόθεμα όπως Success: πριν από {“ok”:true}, ή ένα επίθημα όπως done μετά, καθιστά ολόκληρη τη συμβολοσειρά μη έγκυρη. Ασήμαντο whitespace γύρω από μία τιμή JSON επιτρέπεται. Το JSON δεν απαγορεύει κενά πριν ή μετά την τιμή.

Success:
{"ok":true}

{"ok":true}
done

6. Ανάλυση HTML αντί για JSON

Η κλήση response.json() σε σελίδα HTML είναι συνηθισμένη περίπτωση Unexpected token. Λάθος endpoints, σελίδες HTML 404 ή 500, ανακατευθύνσεις σύνδεσης, σώματα διαμεσολαβητή και σελίδες εφεδρείας συχνά ξεκινούν με σήμανση. Το «Unexpected token < σημαίνει πάντα HTML» είναι υπερβολικά ισχυρό: το < είναι ένδειξη, όχι απόδειξη.

fetch('/api/data')
  .then(response => response.json())

Τι σημαίνει συνήθως το “Unexpected token <”;

Οι τιμές JSON κανονικά δεν ξεκινούν με <. Αν το σώμα αρχίζει με ή , το < μπορεί να είναι ο πρώτος παράνομος χαρακτήρας. Κατά την τοπική αποσφαλμάτωση, ελέγξτε την κατάσταση HTTP, το Content-Type και το ακατέργαστο σώμα. Η διατύπωση του κινητήρα εξακολουθεί να διαφέρει.

Ελέγξτε την απόκριση πριν την αναλύσετε

Το σώμα του fetch καταναλώνεται μόνο μία φορά. Κατά την τοπική αποσφαλμάτωση, διαβάστε πρώτα το text(), επιθεωρήστε ένα σύντομο πρόθεμα και μετά εκτελέστε JSON.parse στην ίδια συμβολοσειρά. Μην καλείτε response.json() και μετά response.text() στην ίδια απόκριση. Μην καταγράφετε ευαίσθητα φορτία παραγωγής από προεπιλογή.

const response = await fetch(url);
const text = await response.text();

console.log(response.status);
console.log(response.headers.get("content-type"));
console.log(text.slice(0, 200));

try {
  const data = JSON.parse(text);
  console.log(data);
} catch (error) {
  console.error("Invalid JSON:", error);
}

Τι σημαίνει “at position 123”;

Ορισμένοι κινητήρες αναφέρουν θέση, γραμμή ή στήλη. Κοιτάξτε κοντά για κακό εισαγωγικό, κόμμα, άγκιστρο ή escape. Ο δείκτης είναι όπου η ανάλυση παρατήρησε πρόβλημα· η πραγματική αιτία μπορεί να είναι νωρίτερα. Δεν είναι εγγυημένο ότι είναι ακριβώς ο ελαττωματικός χαρακτήρας.

Unexpected token έναντι Unexpected end

Το Unexpected token σημαίνει ότι ο αναλυτής συνάντησε χαρακτήρα που δεν περίμενε. Το Unexpected end μπορεί να εμφανιστεί όταν η είσοδος σταματά πριν ολοκληρωθεί η τιμή, όπως στο {“name”:“Alex” χωρίς κλείσιμο αγκίστρου. Η ακριβής διατύπωση εξαρτάται από τον κινητήρα. Το Συνηθισμένα σφάλματα JSON: τελικό κόμμα, εισαγωγικά και Unexpected token καλύπτει το ημιτελές JSON ευρύτερα.

{"name":"Alex"

Το JSON δεν είναι το ίδιο με κυριολεκτικό αντικείμενο JavaScript

Το JSON είναι μορφή δεδομένων. Ένα κυριολεκτικό αντικείμενο JavaScript είναι σύνταξη JavaScript. Το αντικείμενο JS με κλειδιά χωρίς εισαγωγικά, μονά εισαγωγικά και τελικό κόμμα δεν είναι έγκυρο κείμενο JSON. Το JSON.parse δεν μπορεί να αναλύσει με ασφάλεια κυριολεκτικά αντικείμενα JavaScript.

const data = {
  name: 'Alex',
  active: true,
};

{
  "name": "Alex",
  "active": true
}

Μπορεί το JSON να περιέχει σχόλια;

Το τυπικό JSON δεν υποστηρίζει σχόλια. Μια γραμμή // μέσα σε αντικείμενο είναι μη έγκυρη. Το JSON5 και παρόμοιες επεκτάσεις είναι διαφορετικές μορφές. Το Μορφοποίηση και σύγκριση JSON επικυρώνει τυπικό JSON με JSON.parse και δεν αντιμετωπίζει το JSON5 ως JSON.

{
  // user name
  "name": "Alex"
}

Είναι τα undefined, NaN και Infinity έγκυρο JSON;

Όχι. Οι τιμές JSON είναι αντικείμενο, πίνακας, συμβολοσειρά, αριθμός, true, false και null. Τα undefined, NaN και Infinity δεν είναι. Μια τιμή κορυφαίου επιπέδου δεν χρειάζεται να είναι αντικείμενο ή πίνακας: τα true, 123, “hello” και null είναι έγκυρο JSON.

{"a":undefined}
{"a":NaN}
{"a":Infinity}

true
123
"hello"
null

Πώς να διορθώσετε σφάλμα Unexpected token βήμα προς βήμα

Δουλέψτε την πηγή, όχι τη συμβολοσειρά σφάλματος:

1. Επιβεβαιώστε ότι η είσοδος είναι πράγματι JSON, όχι HTML, αρχεία καταγραφής ή JavaScript.
2. Επιθεωρήστε τους πρώτους χαρακτήρες της ακατέργαστης εισόδου.
3. Αν ήρθε από API, ελέγξτε την κατάσταση HTTP και το Content-Type. Ούτε το 200 ούτε το application/json εγγυώνται έγκυρο JSON.
4. Επικυρώστε τη σύνταξη σε αναλυτή JSON.
5. Χρησιμοποιήστε οποιαδήποτε αναφερόμενη θέση, γραμμή ή στήλη ως ένδειξη, όχι ως εγγυημένη ρίζα αιτίας.
6. Ελέγξτε εισαγωγικά, κόμματα, άγκιστρα, αγκύλες και escapes κοντά σε εκείνη την περιοχή.
7. Συγκρίνετε με μορφοποιημένο, επικυρωμένο αντίγραφο.
8. Διορθώστε τον σειριοποιητή ή το endpoint. Μην διαγράφετε τυχαία το αναφερόμενο token.

Χρησιμοποιήστε JSON.stringify() όταν παράγετε JSON σε JavaScript

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

const data = {
  name: "Alex",
  active: true
};
const json = JSON.stringify(data);
// {"name":"Alex","active":true}

Μη έγκυρο JSON έναντι πραγματικής διόρθωσης

Αυτά τα ζεύγη ελέγχθηκαν με JSON.parse. Για HTML, η διόρθωση είναι η απόκριση, όχι επεξεργασία σύνταξης.

Πρόβλημα	Μη έγκυρο	Διόρθωση
Μονά εισαγωγικά	{'a':1}	{"a":1}
Τελικό κόμμα	{"a":1,}	{"a":1}
Κλειδί χωρίς εισαγωγικά	{a:1}	{"a":1}
undefined	{"a":undefined}	{"a":null}
Σώμα HTML	<html>...	Ελέγξτε το endpoint και την ακατέργαστη απόκριση. Μην επεξεργάζεστε HTML σε JSON.

Απλός οδηγός απόφασης για Unexpected token

Αν το JSON.parse απέτυχε, αποφασίστε αν έχετε καν JSON πριν ξαναγράψετε εισαγωγικά.

• Το JSON.parse απέτυχε
• ↓
• Από API; Ελέγξτε κατάσταση, Content-Type και ακατέργαστο σώμα
• Ξεκινά ως JSON; Αν όχι, διορθώστε την πηγή ή το endpoint
• Αν ναι, επικυρώστε εισαγωγικά, κόμματα, άγκιστρα, αγκύλες, escapes, μη υποστηριζόμενες τιμές
• Χρησιμοποιήστε την αναφερόμενη θέση ως ένδειξη
• ↓
• Διορθώστε την πηγή και αναλύστε ξανά

Επικυρώστε JSON πριν το αναλύσετε ή το χρησιμοποιήσετε

Το NEXNARA Μορφοποίηση και σύγκριση JSON επικυρώνει JSON στο πρόγραμμα περιήγησης με JSON.parse—όχι eval.

Επικύρωση, όμορφη εκτύπωση με 2 κενά, 4 κενά ή στηλοθέτες, minify, αντιγραφή, λήψη και μεταφόρτωση .json. Το JSON Diff καλύπτει ένθετα αντικείμενα και πίνακες, διαδρομές, σύνοψη, φίλτρα και ανταλλαγή. Μετά την ανάλυση, το όμορφο και το minified αντίγραφο των ίδιων δεδομένων συγκρίνονται ως ίσα· τα κλειδιά αντικειμένου συγκρίνονται κατά όνομα.

Κείμενο μεγαλύτερο από 5 MB μπορεί να φαίνεται αργό. Κείμενο μεγαλύτερο από 15 MB δεν επεξεργάζεται στο πρόγραμμα περιήγησης.

Η επικύρωση και η μορφοποίηση JSON γίνονται στο πρόγραμμα περιήγησής σας. Αυτό το εργαλείο δεν στέλνει το JSON σε διακομιστή NEXNARA. Διαφημίσεις και άλλα χαρακτηριστικά ιστότοπου χρησιμοποιούν ακόμα το δίκτυο.

Επικολλήστε τη συμβολοσειρά που αποτυγχάνει στο Μορφοποίηση και σύγκριση JSON και διαβάστε τους πρώτους χαρακτήρες πριν ξαναγράψετε εισαγωγικά.

FAQ

Γιατί το JSON.parse λέει Unexpected token;

Το κείμενο δεν είναι έγκυρο JSON στο σημείο όπου σταμάτησε ο αναλυτής. Τυπικές αιτίες είναι εισαγωγικά, κόμματα, επιπλέον κείμενο ή σώμα που δεν είναι JSON, όπως HTML.

Τι σημαίνει Unexpected token < in JSON;

Ο πρώτος παράνομος χαρακτήρας μπορεί να είναι <. Αυτό συχνά δείχνει σε σελίδα HTML, αλλά δεν είναι απόδειξη 404 ούτε HTML σε κάθε περίπτωση. Ελέγξτε κατάσταση, Content-Type και ακατέργαστο σώμα.

Πώς βρίσκω τη θέση σφάλματος στο JSON;

Αν ο κινητήρας αναφέρει θέση, γραμμή ή στήλη, κοιτάξτε κοντά. Το πραγματικό λάθος μπορεί να είναι νωρίτερα. Χρησιμοποιήστε το ως ένδειξη και μετά επικυρώστε.

Μπορεί το JSON να χρησιμοποιεί μονά εισαγωγικά;

Όχι. Στο τυπικό JSON οι συμβολοσειρές και τα ονόματα μελών χρησιμοποιούν διπλά εισαγωγικά.

Μπορεί το JSON να έχει τελικά κόμματα;

Όχι. Το τυπικό JSON δεν επιτρέπει κόμμα μετά την τελευταία ιδιότητα ή το τελευταίο στοιχείο πίνακα.

Πώς ελέγχω αν μια συμβολοσειρά είναι έγκυρο JSON;

Καλέστε JSON.parse σε try/catch, ή επικολλήστε το κείμενο στο Μορφοποίηση και σύγκριση JSON. Αν η ανάλυση ρίξει SyntaxError, η συμβολοσειρά δεν είναι έγκυρο JSON.