Per què JSON.parse diu "Unexpected token"?

Això és el diagnòstic d’Unexpected token amb JSON.parse: què vol dir l’error, com llegir la posició i què fer si el cos és HTML. Les comes finals, les cometes i Unexpected end s’expliquen amb més amplitud a Errors habituals de JSON: coma final, cometes i Unexpected token.

Què vol dir “Unexpected token” a JSON.parse()?

JSON.parse() exigeix la gramàtica JSON. Un caràcter il·legal a la posició actual llança SyntaxError. {“name”:“Alex”,} és invàlid: després d’aquella coma l’objecte no pot acabar. El text del missatge i la posició encara varien segons el temps d’execució.

Quin error llança JSON.parse()?

El JSON invàlid, en general, llança SyntaxError. Registreu error.name per confirmar el tipus. No deixeu fixat tot error.message: motors i versions el redacten de maneres diferents.

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

1. Fer servir cometes simples en lloc de dobles

{‘name’:‘Alex’} és JSON invàlid. {“name”:“Alex”} és vàlid. Les cadenes JSON i els noms de membre d’objecte usen cometes dobles. Un literal d’objecte JavaScript com const user = { name: ‘Alex’ } pot ser JavaScript legal i, tot i així, no ser text JSON.

Invàlid

{'name':'Alex'}

Vàlid

{"name":"Alex"}

2. Comes finals

Una coma després de l’última propietat o de l’últim element d’array no és JSON estàndard vàlid. {“name”:“Alex”,“age”:30,} i [1, 2, 3,] fallen tots dos. Tracteu-ho com una causa d’Unexpected token; Errors habituals de JSON: coma final, cometes i Unexpected token aprofundeix en les comes finals.

Invàlid

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

Vàlid

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

[1, 2, 3,]

3. Noms de propietat sense cometes

{ name: “Alex” } pot ser un literal d’objecte JavaScript. En JSON, els noms de membre són cadenes i necessiten cometes dobles: {“name”:“Alex”}.

Invàlid

{
  name: "Alex"
}

Vàlid

{
  "name": "Alex"
}

4. Escape de cadena invàlid

En el text JSON una barra invertida inicia un escape. Un camí cru com C:\Users\Alex és invàlid perquè \U no és un escape legal. Dobleu les barres invertides. No barregeu l’escape del llenguatge amfitrió amb l’escape JSON. Errors habituals de JSON: coma final, cometes i Unexpected token ho cobreix amb més detall.

Invàlid

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

Vàlid

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

5. Text de més abans o després del JSON

JSON.parse espera un sol valor JSON. Un prefix com Success: davant de {“ok”:true}, o un sufix com done al darrere, deixa invàlida tota la cadena. L’espai en blanc insignificant al voltant d’un únic valor JSON sí que és permès. JSON no prohibeix espais abans o després del valor.

Success:
{"ok":true}

{"ok":true}
done

6. Analitzar HTML en lloc de JSON

Cridar response.json() sobre una pàgina HTML és un cas habitual d’Unexpected token. Extrems incorrectes, pàgines HTML 404 o 500, redireccions de login, cossos de proxy i pàgines de recanvi sovint comencen amb marcatge. «Unexpected token < sempre vol dir HTML» és massa rotund: < és una pista, no una prova.

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

Què sol voler dir “Unexpected token <”?

Els valors JSON no solen començar per <. Si el cos comença amb o , < pot ser el primer caràcter il·legal. En la depuració local, mireu l’estat HTTP, Content-Type i el cos en brut. El redactat del motor encara varia.

Reviseu la resposta abans d’analitzar-la

El cos de fetch només es pot consumir una vegada. En la depuració local, llegiu text() primer, inspeccioneu un prefix curt i després apliqueu JSON.parse a aquella mateixa cadena. No crideu response.json() i després response.text() sobre la mateixa resposta. No registreu per defecte càrregues sensibles de producció.

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);
}

Què vol dir “at position 123”?

Alguns motors informen una posició, línia o columna. Mireu a prop una cometa, coma, clau o escape incorrectes. Aquell índex és on l’anàlisi va notar un problema; la causa real pot ser anterior. No està garantit que sigui el caràcter defectuós exacte.

Unexpected token davant Unexpected end

Unexpected token vol dir que l’analitzador ha trobat un caràcter que no esperava. Unexpected end pot aparèixer quan l’entrada s’atura abans que el valor sigui complet, com a {“name”:“Alex” sense clau de tancament. El redactat exacte depèn del motor. Errors habituals de JSON: coma final, cometes i Unexpected token cobreix el JSON incomplet amb més amplitud.

{"name":"Alex"

JSON no és el mateix que un literal d’objecte JavaScript

JSON és un format de dades. Un literal d’objecte JavaScript és sintaxi JavaScript. L’objecte JS amb claus sense cometes, cometes simples i una coma final no és text JSON vàlid. JSON.parse no pot analitzar amb seguretat literals d’objecte JavaScript.

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

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

Pot JSON contenir comentaris?

El JSON estàndard no admet comentaris. Una línia // dins d’un objecte és invàlida. JSON5 i extensions semblants són formats distints. Formatar i comparar JSON valida JSON estàndard amb JSON.parse i no tracta JSON5 com a JSON.

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

Són vàlids en JSON undefined, NaN i Infinity?

No. Els valors JSON són objecte, array, cadena, nombre, true, false i null. undefined, NaN i Infinity no ho són. Un valor de nivell superior no cal que sigui un objecte o un array: true, 123, “hello” i null són JSON vàlid.

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

true
123
"hello"
null

Com corregir un error Unexpected token pas a pas

Treballau la font, no la cadena de l’error:

1. Confirmeu que l’entrada és realment JSON, no HTML, registres o JavaScript.
2. Inspeccioneu els primers caràcters de l’entrada en brut.
3. Si ve d’una API, reviseu l’estat HTTP i Content-Type. Ni 200 ni application/json garanteixen JSON vàlid.
4. Valideu la sintaxi en un analitzador JSON.
5. Useu qualsevol posició, línia o columna indicada com a pista, no com a causa arrel garantida.
6. Reviseu cometes, comes, claus, claudàtors i escapes a prop d’aquella zona.
7. Compareu amb una còpia formatada i validada.
8. Corregiu el serialitzador o l’endpoint. No esborreu el testimoni indicat a l’atzar.

Useu JSON.stringify() quan produïu JSON en JavaScript

Prefereu JSON.stringify a concatenar cadenes a mà. Emet text JSON vàlid per als valors que serialitza. No conserva tots els valors JavaScript: undefined, les funcions i els símbols tenen un comportament especial. Aquest detall queda fora d’abast aquí.

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

JSON invàlid davant d’una correcció real

Aquests parells es van comprovar amb JSON.parse. Per a HTML, la correcció és la resposta, no un retoc de sintaxi.

Problema	Invàlid	Correcció
Cometes simples	{'a':1}	{"a":1}
Coma final	{"a":1,}	{"a":1}
Clau sense cometes	{a:1}	{"a":1}
undefined	{"a":undefined}	{"a":null}
Cos HTML	<html>...	Reviseu l'endpoint i la resposta en brut. No editeu HTML per convertir-lo en JSON.

Una guia simple de decisió per a Unexpected token

Si JSON.parse ha fallat, decideu si tan sols teniu JSON abans de reescriure cometes.

• JSON.parse ha fallat
• ↓
• D'una API? Reviseu estat, Content-Type i el cos en brut
• Comença com a JSON? Si no, corregiu la font o l'endpoint
• Si sí, valideu cometes, comes, claus, claudàtors, escapes, valors no admesos
• Useu la posició indicada com a pista
• ↓
• Corregiu la font i torneu a analitzar

Valideu JSON abans d’analitzar-lo o usar-lo

NEXNARA Formatar i comparar JSON valida JSON al navegador amb JSON.parse—no eval.

Valida, formata amb 2 espais, 4 espais o tabuladors, minifica, copia, descarrega i puja .json. JSON Diff cobreix objectes i arrays imbricats, rutes, resum, filtres i intercanvi. Després de l’anàlisi, les còpies formatada i minificada de les mateixes dades es comparen com a iguals; les claus d’objecte es comparen per nom.

El text de més de 5 MB pot anar lent. El text de més de 15 MB no es processa al navegador.

La validació i el formatatge de JSON passen al vostre navegador. Aquesta eina no envia el JSON a un servidor de NEXNARA. Els anuncis i altres funcions del lloc sí que usen la xarxa.

Enganxeu la cadena que falla a Formatar i comparar JSON i llegiu els primers caràcters abans de reescriure cometes.

FAQ

Per què JSON.parse diu Unexpected token?

El text no és JSON vàlid al punt on l’analitzador s’ha aturat. Causes típiques: cometes, comes, text de més o un cos que no és JSON, com HTML.

Què vol dir Unexpected token < in JSON?

El primer caràcter il·legal pot ser <. Això sovint apunta a una pàgina HTML, però no és prova d’un 404 ni d’HTML en tots els casos. Reviseu l’estat, Content-Type i el cos en brut.

Com trobo la posició de l’error en JSON?

Si el motor informa una posició, línia o columna, mireu a prop. El fall real pot ser anterior. Useu-la com a pista i després valideu.

Pot JSON usar cometes simples?

No. En JSON estàndard, les cadenes i els noms de membre usen cometes dobles.

Pot JSON tenir comes finals?

No. El JSON estàndard no permet una coma després de l’última propietat o de l’últim element d’array.

Com comprovo si una cadena és JSON vàlid?

Crideu JSON.parse en un try/catch, o enganxeu el text a Formatar i comparar JSON. Si l’anàlisi llança SyntaxError, la cadena no és JSON vàlid.