SyntaxError non intercepté: jeton inattendu:

193

J'exécute un appel AJAX dans mon script MooTools, cela fonctionne bien dans Firefox mais dans Chrome, j'obtiens une Uncaught SyntaxError: Unexpected token :erreur, je ne peux pas déterminer pourquoi. Commenter du code pour déterminer où se trouve le mauvais code ne donne rien, je pense que cela peut être un problème avec le retour du JSON. En vérifiant dans la console, je vois le JSON retourné est le suivant:

{"votes":47,"totalvotes":90}

Je ne vois aucun problème, pourquoi cette erreur se produirait-elle?

vote.each(function(e){
  e.set('send', {
    onRequest : function(){
      spinner.show();
    },
    onComplete : function(){
      spinner.hide();
    },
    onSuccess : function(resp){
      var j = JSON.decode(resp);
      if (!j) return false;
      var restaurant = e.getParent('.restaurant');
      restaurant.getElements('.votes')[0].set('html', j.votes + " vote(s)");
      $$('#restaurants .restaurant').pop().set('html', "Total Votes: " + j.totalvotes);
      buildRestaurantGraphs();
    }
  });

  e.addEvent('submit', function(e){
    e.stop();
    this.send();
  });
});
trobrock
la source
1
Le JSON est bien. Le problème est probablement de savoir comment vous le gérez. L'affichage du code vous aidera.
tcooc
1
Ajout de la partie de code à la question.
trobrock
Il ne semble pas y avoir de problème avec la syntaxe, le JS ni le JSON. Publier un cas de test (non) fonctionnel sur jsfiddle.net aiderait - y compris HTML.
Oskar Krawczyk le
1
Je suis actuellement connecté à Internet, donc mon modem compresse la source HTML des sites Web que je navigue, donc je ne peux pas vraiment faire des queues ou des queues avec le code. Mais, pour commencer, mettez chaque code JS dans des fichiers externes - cela facilite toujours le débogage - vous saurez que l'erreur est causée par JS ou autre chose.
Oskar Krawczyk
2
Un «jeton inattendu» est probablement un code de caractère illégal. Un tel code ne s'affichera probablement pas lorsque vous imprimez sur la console. Par conséquent, imprimez la chaîne un caractère à la fois ou utilisez un analyseur de protocole ou un débogueur, etc. pour voir les octets réels de la chaîne.
GroovyDotCom

Réponses:

94

Voir des erreurs rouges

Erreur de syntaxe non interceptée: jeton inattendu <

dans l'onglet de la console de votre développeur Chrome, il y a une indication HTML dans le corps de la réponse.

Ce que vous voyez réellement, c'est la réaction de votre navigateur à la ligne supérieure inattendue <!DOCTYPE html>du serveur.

andy magoon
la source
4
Je n'ai aucune idée de la raison pour laquelle vous parlez de "jeton inattendu <" lorsque la question concerne Unexpected token :. Votre réponse n'a aucun rapport avec le problème d'OP.
Michał Perłakowski
1
Et comment résoudre ce problème? J'ai une redirection php qui en est la cause dans Chrome.
Works for a Living
7
Pour ajouter à @andy_magoon, dans mon cas, j'avais une balise de script qui était censée servir du javascript, mais parce que la requête était redirigée vers une page HTML (ce n'est pas important pourquoi elle a été redirigée), qui commence par <! DOCTYPE html >, qui n'est pas un javascript valide, le navigateur renvoie SyntaxError lorsqu'il tente d'analyser le HTML en tant que JS.
david.barkhuizen
2
@Thom La façon de résoudre ce problème est de s'assurer que HTTP get renvoie le fichier javascript que vous recherchez, et non du HTML inattendu.
david.barkhuizen
1
J'ai eu exactement cette erreur car, en fin de compte, le chemin du fichier est incorrect et il ne peut pas trouver le fichier spécifié dans la balise de script.
newman
80

Juste un FYI pour les personnes qui pourraient avoir le même problème - je devais juste obliger mon serveur à renvoyer le JSON en tant qu'application / json et le gestionnaire jQuery par défaut fonctionnait bien.

Edward Abrams
la source
4
Je pense que j'ai l'inverse de ce problème. Je demande JSON à une API tierce et ils renvoient application / javascript comme réponse et j'obtiens la même erreur que vous avez signalée dans cette question. Je ne sais pas comment y faire face.
wuliwong
5
Un problème étrange est - cela fonctionne bien sur l'hôte local mais pas sur le serveur. Une idée pourquoi?
VishwaKumar
Bonjour. J'ai un problème exact et je ne peux pas le résoudre, quelqu'un peut-il me dire comment vous renvoyez JSON au serveur
Alen
Merci, j'envoyais application / javascript (car j'ai mal lu ce SO ) et recevais cette erreur sur un simple JSON valide. Le modifier pour application/jsonrésoudre l'erreur. Je n'utilise pas JSONP.
scipilot
Même si j'obtiens la même erreur "Uncaught SyntaxError: Uncaught token:", même après avoir reçu la réponse au format json {"success": true, "data": 2593}
Rupali Pemare
41

Cela vient de m'arriver, et la raison n'était aucune des raisons ci-dessus. J'utilisais la commande jQuery getJSON et j'ajoutais callback=?pour utiliser JSONP (car j'avais besoin d'aller sur plusieurs domaines), et je renvoyais le code JSON{"foo":"bar"} et obtenais l'erreur.

C'est parce que j'aurais dû inclure les données de rappel, quelque chose comme jQuery17209314005577471107_1335958194322({"foo":"bar"})

Voici le code PHP que j'ai utilisé pour y parvenir, qui se dégrade si JSON (sans callback) est utilisé:

$ret['foo'] = "bar";
finish();

function finish() {
    header("content-type:application/json");
    if ($_GET['callback']) {
        print $_GET['callback']."(";
    }
    print json_encode($GLOBALS['ret']);
    if ($_GET['callback']) {
        print ")";
    }
    exit; 
}

J'espère que cela aidera quelqu'un à l'avenir.

Sinistre...
la source
Cela m'a beaucoup aidé. Nous devrions envelopper les données json avec les données jsoncallback chaque fois que nous utilisons la méthode jsonp. De plus, les données jsonpcallback ne doivent pas commencer par des nombres. Quand j'ai essayé avec des chiffres, ça n'a pas marché. Quand je l'ai essayé avec le même format indiqué dans cette réponse, cela a fonctionné ...
Ganesh Babu
C'est vrai, mais l'erreur est la même et le code se dégradera gracieusement et fonctionnera toujours si JSON est utilisé.
Grim ...
Cela a fonctionné pour moi avec AJAX, jQuery et JSONP. Merci beaucoup!
Piotr Wittchen
16

Je viens de résoudre le problème. Il y avait quelque chose qui causait des problèmes avec un appel de demande standard, c'est donc le code que j'ai utilisé à la place:

vote.each(function(element){                
  element.addEvent('submit', function(e){
    e.stop();
    new Request.JSON({
      url : e.target.action, 
      onRequest : function(){
        spinner.show();
      },
      onComplete : function(){
        spinner.hide();
      },
      onSuccess : function(resp){
        var j = resp;
        if (!j) return false;
        var restaurant = element.getParent('.restaurant');
        restaurant.getElements('.votes')[0].set('html', j.votes + " vote(s)");
        $$('#restaurants .restaurant').pop().set('html', "Total Votes: " + j.totalvotes);
        buildRestaurantGraphs();
      }
    }).send(this);
  });
});

Si quelqu'un sait pourquoi l'objet Request standard me posait des problèmes, j'aimerais le savoir.

trobrock
la source
3
la différence entre standard request et request.json est principalement dans les en-têtes, il ajoute this.headers.extend({'Accept': 'application/json', 'X-Request': 'JSON'});- allez comprendre
Dimitar Christoff
Bizarre que ce soit ce qui causait le problème avec cela.
trobrock
3
Quels sont les doubles $$là-bas?
falsarella
@DimitarChristoff - une réponse pour falsarella sur le $$?
ours
1
@bear Le sélecteur de double dollar est défini dans MooTools.
Anthony Faull
10

J'ai pensé ajouter mon problème et ma résolution à la liste.

J'obtenais: Uncaught SyntaxError: Unexpected token <et l'erreur pointait vers cette ligne dans ma déclaration de réussite ajax:

var total = $.parseJSON(response);

J'ai découvert plus tard qu'en plus des résultats json, du HTML était envoyé avec la réponse car j'avais une erreur dans mon PHP. Lorsque vous obtenez une erreur dans PHP, vous pouvez le configurer pour vous avertir avec d'énormes tables orange et ces tables étaient ce qui rejetait le JSON.

J'ai découvert cela en faisant simplement un console.log(response)pour voir ce qui était réellement envoyé. Si c'est un problème avec les données JSON, essayez simplement de voir si vous pouvez faire un console.log ou une autre instruction qui vous permettra de voir ce qui est envoyé et ce qui est reçu.

Keven
la source
1
J'ai fait ça. Je faisais écho à json quelque part dans mon fichier php et recevais php [// données json] dans ma réponse mais je n'ai pas pu l'analyser. Merci de poster ceci afin que je puisse comprendre ma propre erreur.
Nicholas Decker
Le problème OP est complètement différent. Dans votre cas, vous essayez d'analyser le HTML en tant que JSON, et dans le ou les cas d'OP, il essaie d'analyser JSON en tant que JavaScript.
Michał Perłakowski
7

Lorsque vous demandez votre fichier JSON, le serveur renvoie l'en- Content-Typetête JavaScript ( text/javascript) au lieu de JSON ( application/json).

Selon la documentation de MooTools :

Les réponses avec un type de contenu javascript seront évaluées automatiquement.

En résultat, MooTools essaie d'évaluer votre JSON en tant que JavaScript, et lorsque vous essayez d'évaluer un tel JSON:

{"votes":47,"totalvotes":90}

comme JavaScript, l'analyseur traite {et }comme une portée de bloc au lieu de la notation d'objet. C'est la même chose que d'évaluer le "code" suivant:

"votes":47,"totalvotes":90

Comme vous pouvez le voir, : c'est totalement inattendu là-bas.

La solution consiste à définir un en- Content-Typetête correct pour le fichier JSON. Si vous l'enregistrez avec l' .jsonextension, votre serveur devrait le faire tout seul.

Michał Perłakowski
la source
4

Il semble que votre réponse soit évaluée d'une manière ou d'une autre. Cela donne la même erreur dans Chrome:

var resp = '{"votes":47,"totalvotes":90}';
eval(resp);

Cela est dû au fait que les accolades '{...}' sont interprétées par javascript comme un bloc de code et non comme un objet littéral comme on pourrait s'y attendre.

Je regarderais la fonction JSON.decode () et verrais s'il y a un eval là-dedans.

Problème similaire ici: Eval () = jeton inattendu: erreur

Zectbumo
la source
2

Si rien n'a de sens, cette erreur peut également être causée par une erreur PHP intégrée à html / javascript, telle que celle ci-dessous

<br />
<b>Deprecated</b>:  mysql_connect(): The mysql extension is deprecated and will be removed in the future: use mysqli or PDO instead in <b>C:\Projects\rwp\demo\en\super\ge.php</b> on line <b>54</b><br />
var zNodes =[{ id:1, pId:0, name:"ACE", url: "/ace1.php", target:"_self", open:true}

Ce n'est pas le <br />etc dans le code inséré dans html par PHP qui est à l'origine de l'erreur . Pour corriger ce type d'erreur (supprimer l'avertissement), utilisez ce code au début

error_reporting(E_ERROR | E_PARSE);

Pour afficher, cliquez avec le bouton droit sur la page, «afficher la source», puis examinez le code HTML complet pour repérer cette erreur.

Hammad Khan
la source
1

Erreur " SyntaxError non interceptée: jeton inattendu " lorsque vos données renvoient un format json incorrect, dans certains cas, vous ne savez pas que vous avez un format json incorrect.
veuillez le vérifier avec alert (); fonction

onSuccess : function(resp){  
   alert(resp);  
}

votre message reçu doit être: {"firstName": "John", "lastName": "Doe"}
et vous pouvez ensuite utiliser le code ci-dessous

onSuccess : function(resp){  
   var j = JSON.decode(resp); // but in my case i'm using: JSON.parse(resp); 
}

sans erreur " Uncaught SyntaxError: Uncaught token "
mais si vous vous trompez de format json
ex:

... {"firstName": "John", "lastName": "Doe"}

ou

Undefined variable: errCapt in .... on line<b>65</b><br/>{"firstName":"John", "lastName":"Doe"}

afin que vous n'ayez pas le bon format json, veuillez le corriger avant JSON.decode ou JSON.parse

Serip88
la source
3
Je recommande d'utiliser console.log()au lieu de alert()pour le débogage.
Michał Perłakowski
1

Cela m'est également arrivé aujourd'hui. J'utilisais EF et renvoyais une entité en réponse à un appel AJAX. Les propriétés virtuelles de mon entité provoquaient une erreur de dépendance cyclique qui n'était pas détectée sur le serveur. En ajoutant l'attribut [ScriptIgnore] sur les propriétés virtuelles, le problème a été résolu.

Au lieu d'utiliser l'attribut ScriptIgnore, il serait probablement préférable de simplement renvoyer un DTO.

Daryl
la source
1

Cela est arrivé parce que j'ai une règle de configuration dans mon serveur express pour renvoyer tout 404 vers /#plus quelle que soit la demande d'origine. Permettre au routeur angulaire / js de gérer la demande. S'il n'y a pas de route js pour gérer ce chemin, une requête /#/whateverest adressée au serveur, qui n'est qu'une requête pour /la page Web entière.

Donc par exemple si je voulais faire une demande /correct/somejsfile.jsmais que je ne l'ai pas tapé, /wrong/somejsfile.jsla demande est faite au serveur. Cet emplacement / fichier n'existe pas, donc le serveur répond par un 302 location: /#/wrong/somejsfile.js. Le navigateur suit volontiers la redirection et la page Web entière est renvoyée. Le navigateur analyse la page comme js et vous obtenez

Erreur de syntaxe non interceptée: jeton inattendu <

Donc, pour aider à trouver le chemin / la requête incriminée, recherchez 302 requêtes.

J'espère que cela aide quelqu'un.

Jerinaw
la source
1

J'ai eu le même problème et il s'est avéré que le Json renvoyé par le serveur n'était pas un Json-P valide. Si vous n'utilisez pas l'appel comme appel interdomaine, utilisez Json standard.

Jakob
la source
OP utilise JSON, pas JSONP.
Michał Perłakowski
0

J'ai eu un " SyntaxError: Unexpected token I" quand jQuery.getJSON()j'essayais de dé-sérialiser une valeur à virgule flottante de Infinity, encodée comme INF, ce qui est illégal en JSON.

Mark Cidade
la source
1
Cette question concerne "Jeton inattendu : ".
Michał Perłakowski
0

Dans mon cas, j'ai rencontré la même erreur, lors de l'exécution de l'application spring mvc en raison d'un mauvais mappage dans mon contrôleur mvc

@RequestMapping(name="/private/updatestatus")

j'ai changé le mappage ci-dessus en

 @RequestMapping("/private/updatestatus")

ou

 @RequestMapping(value="/private/updatestatus",method = RequestMethod.GET)
Shravan Ramamurthy
la source
0

Pour moi, l'ampoule s'est allumée lorsque j'ai consulté la source sur la page dans le navigateur Chrome. J'avais une parenthèse supplémentaire dans une instruction if. Vous verrez immédiatement le cercle rouge avec une croix sur la ligne défaillante. C'est un message d'erreur plutôt inutile, car l'erreur de syntaxe Uncaught: un jeton inattendu ne fait aucune référence à un numéro de ligne lorsqu'il apparaît pour la première fois dans la console de Chrome.

JGFMK
la source
0

J'ai fait du mal dans ce

   `var  fs = require('fs');
    var fs.writeFileSync(file, configJSON);`

J'ai déjà initialisé la fsvariable, mais encore une fois, je mets varla deuxième ligne, celle-ci donne aussi ce genre d'erreur ...

Janen R
la source
0

Pour ceux qui rencontrent cela dans AngularJs 1.4.6 ou similaire, mon problème était que angular ne trouvait pas mon modèle car le fichier au templateUrl(chemin) que j'ai fourni était introuvable. Je devais juste fournir un chemin accessible et le problème a disparu.

lwdthe1
la source
J'ai résolu le même problème en corrigeant l'url baseref - pointé vers le dossier racine => <base href = "/">
Abdeali Chandanwala
0

Dans mon cas, c'était une URL erronée (inexistante), alors peut-être que votre `` envoi '' en deuxième ligne devrait être autre ...

Michal - Wereda-net
la source
0

Mon erreur a été d' oublier les devis simples / doubles autour de l'URL en javascript:

si mauvais code était:

window.location = https://google.com;

et code correct :

window.location = "https://google.com";
Saeed Arianmanesh
la source
-2

SyntaxError non interceptée: jeton inattendu}

Chrome m'a donné l'erreur pour cet exemple de code:

<div class="file-square" onclick="window.location = " ?dir=zzz">
    <div class="square-icon"></div>
    <div class="square-text">zzz</div>
</div>

et l'a résolu en fixant le clic pour être comme

... onclick="window.location = '?dir=zzz'" ...

Mais l'erreur n'a rien à voir avec le problème.

ungalcrys
la source
OP a posé une question sur "Jeton inattendu : ".
Michał Perłakowski