Technische hulp

Waarom zegt JSON.parse "Unexpected token"?

JSON.parse gooit Unexpected token als de tekst geen geldige JSON is. Debug enkele aanhalingstekens, trailing comma’s, HTML-responses en de foutpositie.

Kort antwoord

JSON.parse() gooit een SyntaxError wanneer de invoer geen geldige JSON is. “Unexpected token” betekent meestal dat de parser een teken bereikte dat op dat punt in de structuur niet mag.

Veelvoorkomende oorzaken: enkele aanhalingstekens, trailing comma’s, propertynamen zonder quotes, slechte string-escaping, extra tekst rond de JSON, of HTML of een andere niet-JSON-body als JSON parsen.

De exacte fouttekst verschilt per JavaScript-engine en browser. Ga er niet van uit dat elke runtime “Unexpected token X in JSON at position N” afdrukt.

Dit is JSON.parse Unexpected token-diagnostiek: wat de fout betekent, hoe je de positie leest, en wat te doen als de body HTML is. Trailing comma’s, aanhalingstekens en Unexpected end staan breder in Veelvoorkomende JSON-fouten: trailing comma, aanhalingstekens en Unexpected token.

Wat betekent “Unexpected token” in JSON.parse()?

JSON.parse() vereist JSON-grammatica. Een illegaal teken op de huidige positie gooit SyntaxError. {“name”:“Alex”,} is ongeldig: na die komma mag het object niet eindigen. Berichttekst en positie blijven per runtime verschillen.

Welke fout gooit JSON.parse()?

Ongeldige JSON gooit meestal SyntaxError. Log error.name om het type te bevestigen. Hardcode niet het volledige error.message: engines en versies formuleren het anders.

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

1. Enkele aanhalingstekens in plaats van dubbele

{‘name’:‘Alex’} is ongeldige JSON. {“name”:“Alex”} is geldig. JSON-strings en object-lidnamen gebruiken dubbele aanhalingstekens. Een JavaScript-objectliteral zoals const user = { name: ‘Alex’ } kan legale JavaScript zijn en toch geen JSON-tekst.

Ongeldig

{'name':'Alex'}

Geldig

{"name":"Alex"}

2. Trailing comma’s

Een komma na de laatste property of het laatste array-item is geen geldige standaard-JSON. {“name”:“Alex”,“age”:30,} en [1, 2, 3,] falen allebei. Behandel dit als één Unexpected-token-oorzaak; Veelvoorkomende JSON-fouten: trailing comma, aanhalingstekens en Unexpected token gaat dieper in op trailing comma’s.

Ongeldig

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

Geldig

{
  "name": "Alex",
  "age": 30
}
[1, 2, 3,]

3. Propertynamen zonder aanhalingstekens

{ name: “Alex” } kan een JavaScript-objectliteral zijn. In JSON zijn lidnamen strings en hebben ze dubbele aanhalingstekens nodig: {“name”:“Alex”}.

Ongeldig

{
  name: "Alex"
}

Geldig

{
  "name": "Alex"
}

4. Ongeldige string-escaping

In JSON-tekst begint een backslash een escape. Een ruw pad zoals C:\Users\Alex is ongeldig omdat \U geen legale escape is. Verdubbel de backslashes. Meng hosttaal-escaping niet met JSON-escaping. Veelvoorkomende JSON-fouten: trailing comma, aanhalingstekens en Unexpected token behandelt dit dieper.

Ongeldig

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

Geldig

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

5. Extra tekst voor of na de JSON

JSON.parse verwacht één JSON-waarde. Een prefix zoals Success: vóór {“ok”:true}, of een suffix zoals done erna, maakt de hele string ongeldig. Onbeduidende witruimte rond één JSON-waarde is toegestaan. JSON verbiedt spaties voor of na de waarde niet.

Success:
{"ok":true}
{"ok":true}
done

6. HTML parsen in plaats van JSON

response.json() aanroepen op een HTML-pagina is een veelvoorkomend Unexpected-token-geval. Verkeerde endpoints, 404- of 500-HTML-pagina’s, login-redirects, proxy-bodies en fallback-pagina’s beginnen vaak met markup. “Unexpected token < always means HTML” is te stellig: < is een aanwijzing, geen bewijs.

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

Wat betekent “Unexpected token <” meestal?

JSON-waarden beginnen doorgaans niet met <. Als de body begint met of , kan < het eerste illegale teken zijn. Bij lokaal debuggen: HTTP-status, Content-Type en de ruwe body controleren. De formulering van de engine blijft verschillen.

Controleer de response voordat je hem parst

De fetch-body kan maar één keer worden gelezen. Bij lokaal debuggen eerst text() lezen, een kort prefix bekijken, daarna JSON.parse op diezelfde string. Roep niet response.json() en daarna response.text() aan op dezelfde response. Log gevoelige productie-payloads niet standaard.

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

Wat betekent “at position 123”?

Sommige engines rapporteren een positie, regel of kolom. Kijk in de buurt naar een slecht aanhalingsteken, komma, accolade of escape. Die index is waar het parsen een probleem opmerkte; de echte oorzaak kan eerder liggen. Het is niet gegarandeerd het exacte foute teken.

Unexpected token versus Unexpected end

Unexpected token betekent dat de parser een teken tegenkwam dat hij niet verwachtte. Unexpected end kan verschijnen wanneer de invoer stopt voordat de waarde compleet is, zoals {“name”:“Alex” zonder sluitende accolade. De exacte bewoording is engine-afhankelijk. Veelvoorkomende JSON-fouten: trailing comma, aanhalingstekens en Unexpected token behandelt onvolledige JSON breder.

{"name":"Alex"

JSON is niet hetzelfde als een JavaScript-objectliteral

JSON is een gegevensformaat. Een JavaScript-objectliteral is JavaScript-syntax. Het JS-object met unquoted keys, enkele aanhalingstekens en een trailing comma is geen geldige JSON-tekst. JSON.parse kan JavaScript-objectliterals niet veilig parsen.

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

Mag JSON commentaar bevatten?

Standaard-JSON ondersteunt geen commentaar. Een //-regel in een object is ongeldig. JSON5 en vergelijkbare uitbreidingen zijn andere formaten. JSON opmaken en vergelijken valideert standaard-JSON met JSON.parse en behandelt JSON5 niet als JSON.

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

Zijn undefined, NaN en Infinity geldige JSON?

Nee. JSON-waarden zijn object, array, string, number, true, false en null. undefined, NaN en Infinity zijn dat niet. Een top-level-waarde hoeft geen object of array te zijn: true, 123, “hello” en null zijn geldige JSON.

{"a":undefined}
{"a":NaN}
{"a":Infinity}
true
123
"hello"
null

Een Unexpected-token-fout stap voor stap oplossen

Werk aan de bron, niet aan de foutstring:

  1. Bevestig dat de invoer echt JSON is, geen HTML, logs of JavaScript.
  2. Inspecteer de eerste tekens van de ruwe invoer.
  3. Kwam het van een API, controleer HTTP-status en Content-Type. Noch 200 noch application/json garandeert geldige JSON.
  4. Valideer de syntax in een JSON-parser.
  5. Gebruik een gerapporteerde positie, regel of kolom als aanwijzing, niet als gegarandeerde hoofdoorzaak.
  6. Controleer quotes, komma’s, accolades, haken en escapes in die buurt.
  7. Vergelijk met een geformatteerde, gevalideerde kopie.
  8. Herstel de serializer of de endpoint. Verwijder het gerapporteerde token niet willekeurig.
JSON niet “fixen” door willekeurig quotes te vervangen

Een globale vervanging van ' door " kan apostroffen in strings, al ge-escape-te tekst en niet-JSON-bronnen breken. Produceer geldige JSON vanuit de echte serializer. Behandel eval niet als een JSON-parser.

Gebruik JSON.stringify() als je JSON in JavaScript maakt

Kies JSON.stringify boven het handmatig aan elkaar plakken van strings. Het levert geldige JSON-tekst op voor de waarden die het serialiseert. Het bewaart niet elke JavaScript-waarde: undefined, functies en symbols hebben speciaal gedrag. Dat detail valt hier buiten scope.

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

Ongeldige JSON versus een echte fix

Deze paren zijn gecontroleerd met JSON.parse. Voor HTML is de fix de response, geen syntax-edit.

Probleem Ongeldig Fix
Enkele aanhalingstekens {'a':1} {"a":1}
Trailing comma {"a":1,} {"a":1}
Key zonder quotes {a:1} {"a":1}
undefined {"a":undefined} {"a":null}
HTML-body <html>... Controleer de endpoint en de ruwe response. Bewerk HTML niet tot JSON.

Een eenvoudige beslissingsgids voor Unexpected token

Als JSON.parse faalde, bepaal of je überhaupt JSON hebt voordat je quotes herschrijft.

  • JSON.parse is mislukt
  • Van een API? Controleer status, Content-Type en de ruwe body
  • Begint het als JSON? Zo niet, herstel de bron of de endpoint
  • Zo ja, valideer quotes, komma’s, accolades, haken, escapes, niet-ondersteunde waarden
  • Gebruik de gerapporteerde positie als aanwijzing
  • Herstel de bron en parse opnieuw
Unexpected token benoemt de verrassing. De bron van de tekst is vaak de echte fix.

Valideer JSON voordat je hem parst of gebruikt

NEXNARA JSON opmaken en vergelijken valideert JSON in de browser met JSON.parse—niet eval.

Valideren, opmaken met 2 spaties, 4 spaties of tabs, minificeren, kopiëren, downloaden en .json uploaden. JSON Diff dekt geneste objecten en arrays, paden, samenvatting, filters en omwisselen. Na het parsen vergelijken opgemaakte en geminificeerde kopieën van dezelfde data als gelijk; objectkeys worden op naam vergeleken.

Tekst groter dan 5 MB kan traag aanvoelen. Tekst groter dan 15 MB wordt niet in de browser verwerkt.

JSON-validatie en -opmaak gebeuren in je browser. Deze tool stuurt de JSON niet naar een NEXNARA-server. Advertenties en andere sitefuncties gebruiken nog steeds het netwerk.

Plak de falende string in JSON opmaken en vergelijken en lees de eerste tekens voordat je quotes herschrijft.

FAQ

Waarom zegt JSON.parse Unexpected token?

De tekst is geen geldige JSON op het punt waar de parser stopte. Typische oorzaken: quotes, komma’s, extra tekst, of een niet-JSON-body zoals HTML.

Wat betekent Unexpected token < in JSON?

Het eerste illegale teken kan < zijn. Dat wijst vaak naar een HTML-pagina, maar is geen bewijs van een 404 of van HTML in elk geval. Controleer status, Content-Type en de ruwe body.

Hoe vind ik de foutpositie in JSON?

Als de engine een positie, regel of kolom meldt, kijk ernaast. De echte fout kan eerder liggen. Gebruik het als aanwijzing en valideer daarna.

Mag JSON enkele aanhalingstekens gebruiken?

Nee. In standaard-JSON gebruiken strings en lidnamen dubbele aanhalingstekens.

Mag JSON trailing comma’s hebben?

Nee. Standaard-JSON staat geen komma toe na de laatste property of het laatste array-item.

Hoe controleer ik of een string geldige JSON is?

Roep JSON.parse aan in een try/catch, of plak de tekst in JSON opmaken en vergelijken. Als het parsen SyntaxError gooit, is de string geen geldige JSON.