web-dev-qa-db-fra.com

Je continue à avoir "Uncaught SyntaxError: Jeton inattendu o"

J'essaie d'apprendre du html/css/javascript, alors j'écris moi-même un projet pédagogique.

L'idée était d'avoir du vocabulaire dans un fichier json qui serait ensuite chargé dans une table. J'ai réussi à charger le fichier et à imprimer l'une de ses valeurs, après quoi j'ai commencé à écrire le code pour charger les valeurs dans la table.

Après avoir fait cela, j'ai commencé à avoir une erreur, alors j'ai supprimé tout le code que j'avais écrit, ne me laissant qu'une ligne (la même ligne qui avait fonctionné auparavant) ... seule l'erreur est toujours là.

L'erreur est la suivante:

Uncaught SyntaxError: Unexpected token o
(anonymous function)script.js:10
jQuery.Callbacks.firejquery-1.7.js:1064
jQuery.Callbacks.self.fireWithjquery-1.7.js:1182
donejquery-1.7.js:7454
jQuery.ajaxTransport.send.callback

Mon code javascript est contenu dans un fichier séparé et est simplement ceci:

function loadPageIntoDiv(){
    document.getElementById("wokabWeeks").style.display = "block";
}

function loadWokab(){
    //also tried getJSON which threw the same error
    jQuery.get('wokab.json', function(data) {
        var glacier = JSON.parse(data);
    });
}

Et mon fichier JSON a juste ce qui suit:

[
    {
        "english": "bag",
        "kana": "kaban",
        "kanji": "K"
    },

    {
        "english": "glasses",
        "kana": "megane",
        "kanji": "M"
    }
]

Maintenant, l'erreur est signalée à la ligne 11, qui est la ligne var glacier = JSON.parse(data);.

Lorsque je supprime le fichier json, le message d'erreur suivant s'affiche: "GET http: //.../wokab.json 404 (Introuvable)", donc je sais que le chargement (ou au moins le tente) .

javascriptjqueryjson
301
Bjorninn

On dirait que jQuery devine le type de données. Il effectue l’analyse JSON même si vous n’appelez pas getJSON (). Lorsque vous essayez d’appeler JSON.parse () sur un objet, vous obtenez l’erreur.

Des explications complémentaires peuvent être trouvées dans réponse d'Aditya Mittal .

312
ek_ny

Le problème est très simple

jQuery.get('wokab.json', function(data) {
    var glacier = JSON.parse(data);
});

Vous analysez deux fois. get utilise le dataType='json', ainsi les données sont déjà au format json. Utilisez $.ajax({ dataType: 'json' ... pour définir spécifiquement le type de données renvoyé!

76
Andrius Bentkus

Fondamentalement, si l'en-tête de la réponse est text/html, vous devez analyser, et si l'en-tête de la réponse est application/json, il est déjà analysé pour vous.

Données analysées par le gestionnaire de réussite jQuery pour la réponse text/html:

var parsed = JSON.parse(data);

Données analysées à partir du gestionnaire de succès jQuery pour la réponse application/json:

var parsed = data;
52
Aditya Mittal

Autres astuces pour les erreurs Unexpected token. Il existe deux différences majeures entre les objets javascript et json:

  1. les données json doivent toujours être entre guillemets.
  2. les clés doivent être citées

JSON correct

 {
    "english": "bag",
    "kana": "kaban",
    "kanji": "K"
}

Erreur JSON 1

 {
    'english': 'bag',
    'kana': 'kaban',
    'kanji': 'K'
 }

Erreur JSON 2

 {
    english: "bag",
    kana: "kaban",
    kanji: "K"
}

Remarque

Ce n'est pas une réponse directe à cette question. Mais c'est une réponse aux erreurs Unexpected token. Donc, il peut être utile d’aider les autres qui s’efforcent de répondre à cette question.

10
Matthias M

Simplement, la réponse est déjà analysée, vous n'avez pas besoin de l'analyser à nouveau. si vous réanalysez-le à nouveau, vous obtiendrez un "jeton inattendu", mais vous devrez spécifier le type de données dans votre demande pour qu'il soit de type dataType='json'

2
Muhammad Soliman

J'ai eu un problème similaire tout à l'heure et ma solution pourrait aider. J'utilise un iframe pour télécharger et convertir un fichier XML en json et le renvoyer dans les coulisses. Chrome ajoutait une mauvaise image aux données entrantes, qui n'apparaissait que de manière intermittente et provoquait la SyntaxError: Jeton inattendu "erreur".

J'accédais aux données iframe comme ceci:

$('#load-file-iframe').contents().text()

ce qui a bien fonctionné sur localhost, mais lorsque je l'ai téléchargé sur le serveur, il a cessé de fonctionner uniquement avec certains fichiers et uniquement lors du chargement des fichiers dans un certain ordre. Je ne sais pas vraiment ce qui l'a causé, mais cela a résolu le problème. J'ai changé la ligne ci-dessus pour

$('#load-file-iframe').contents().find('body').text()

une fois, j'ai remarqué des erreurs dans la réponse HTML.

Longue histoire, vérifiez vos données de réponse HTML brutes et vous pourriez faire bouger les choses.

1
Brandon
SyntaxError: Unexpected token o in JSON

Cela se produit également lorsque vous oubliez d'utiliser le mot clé await pour une méthode renvoyant des données JSON.

Par exemple:

async function returnJSONData()
{
   return "{\"prop\": 2}";
}

var json_str = returnJSONData();
var json_obj = JSON.parse(json_str);

générera une erreur à cause de la variable await manquante. Ce qui est effectivement renvoyé est un Promise [objet], pas un string.

Pour corriger, il suffit d’ajouter wait comme vous êtes supposé:

var json_str = await returnJSONData();

Cela devrait être assez évident, mais l'erreur est appelée sur JSON.parse, il est donc facile de l'ignorer s'il y a un distance entre votre appel de méthode await et le JSON.parse appel.

0
Obinwanne Hill

Assurez-vous que votre fichier JSON ne comporte aucun caractère de fin avant ou après. Peut-être un non imprimable? Vous voudrez peut-être essayer de cette façon:

[{"english":"bag","kana":"kaban","kanji":"K"},{"english":"glasses","kana":"megane","kanji":"M"}]
0
thexebolud