« Unexpected token o in JSON at position 1 » — ce que ça signifie vraiment
Cette erreur ne signifie presque jamais que votre JSON est cassé. Elle signifie que vous avez appelé JSON.parse sur quelque chose qui n'a jamais été une chaîne JSON — et la lettre du message vous dit exactement ce que vous avez passé.
Si vous fixez un « Unexpected token o in JSON at position 1 », votre JSON est probablement parfait. Cette erreur signifie que JSON.parse a reçu une valeur qui était déjà un objet JavaScript, et non une chaîne de texte JSON. C'est l'un des messages d'erreur les plus trompeurs de JavaScript, car il désigne les données alors que le bug est dans l'appel.
D'où vient le « o »
JSON.parse n'accepte qu'une chaîne. Si vous lui passez un objet, JavaScript convertit silencieusement cet objet en texte au préalable — et tout objet simple se convertit en le texte littéral « [object Object] ». Le parseur commence alors à lire ce texte : la position 0 est « [ », une façon parfaitement valide de commencer un tableau JSON, donc il continue. La position 1 est « o », qui n'est ni une valeur, ni une clé, ni un crochet valide. D'où : unexpected token o, à la position 1. Le « o » dont on vous avertit est la deuxième lettre du mot « object ».
Les trois situations qui la provoquent
De loin la plus courante est le double parsing. Des méthodes comme res.json() de fetch ou axios parsent déjà le corps de la réponse pour vous, si bien qu'appeler JSON.parse sur le résultat parse quelque chose qui est déjà un objet. La deuxième est de passer un objet directement à JSON.parse alors que vous vouliez JSON.stringify — les deux se confondent facilement quand on va vite. La troisième est de lire depuis un stockage comme localStorage où une écriture précédente a enregistré un objet sans le stringifier, si bien que la valeur stockée est le texte littéral « [object Object] » et échouera indéfiniment jusqu'à ce que vous l'effaciez.
Les erreurs voisines, et ce que chaque caractère indique
Le caractère nommé dans le message est un diagnostic précis : lisez-le au lieu de le survoler. « Unexpected token < » signifie que vous avez reçu du HTML et non du JSON — presque toujours une page d'erreur 404 ou 500, une redirection vers le login, ou l'interception d'un proxy, et le vrai bug est dans la requête, pas dans le parsing. « Unexpected end of JSON input » signifie que le corps était complètement vide, typique d'une réponse 204 ou d'une requête qui a échoué avant de renvoyer quoi que ce soit. « Unexpected token } » indique généralement une virgule finale avant l'accolade fermante, ce que les littéraux d'objet JavaScript autorisent mais que JSON interdit strictement. Et « Unexpected token ' » signifie que des apostrophes ont été utilisées pour les chaînes, à nouveau du JavaScript valide mais du JSON invalide.
Comment la trouver en dix secondes
Avant de modifier la moindre logique de parsing, affichez typeof votreValeur juste avant l'appel à JSON.parse. Si cela affiche « object », supprimez le JSON.parse — la valeur est déjà parsée et vous alliez la déparser. Si cela affiche « string », ouvrez l'onglet Réseau des devtools du navigateur et regardez le corps de réponse brut plutôt que l'aperçu formaté, car les devtools affichent volontiers une page d'erreur HTML d'une manière qui paraît structurée. Le texte brut vous dit la vérité d'un seul coup d'œil.
Une fois le texte réel de la réponse en main, collez-le dans notre formateur JSON — il valide la syntaxe et pointe le caractère exact où la structure casse, bien plus vite que de lire à l'œil un payload minifié sur une seule ligne. Tout s'exécute dans votre navigateur, vous pouvez donc coller sans risque une vraie réponse d'API.