web-dev-qa-db-fra.com

JsonP renvoyant "SyntaxError non capturée: jeton inattendu:" AngularJS - routingnumbers.info

J'ai fait des recherches ridicules sur cette question et j'espère que quelqu'un pourra aider à diagnostiquer ce qui ne va pas.

J'ai déjà essayé de regarder les SO questions suivantes: (SO ne me laisserait pas poster plus de 2 liens en raison de la réputation, donc je viens d'inclure les chemins)

  1. questions/16344933/angularjs-jsonp-not-working/16352746 # 16352746
  2. questions/19269153/jsonp-request-in-angularjs-doesnt-work-like-in-jquery
  3. questions/19669044/angularjs-getting-syntax-error-in-return-json-from-http-jsonp

Parmi beaucoup d'autres......

Ce que j'ai essayé: J'ai ajouté & callback = JSON_CALLBACK à la fin de l'url. J'ai changé les paramètres de configuration tels que responseType: 'JSON'. J'ai également réorganisé la demande http.jsonp plusieurs fois pour m'assurer que ce n'était pas quelque chose de programmatique/textuel (http ({}) & http.jsonp)

Voici ce que j'essaye de faire: Récupérer des informations routingnumbers.info/api/ en utilisant une angular jsonp request (le serveur ne permet pas CORS). Je suis en mesure de faire la demande avec succès avec jQuery, mais je ne suis pas en mesure de le faire avec angular.

Voici le violon de test correspondant: http://jsfiddle.net/dqcpa/14/

Comme vous pouvez le voir, je reçois deux erreurs:

  1. Ressource interprétée comme Script mais transférée avec du texte de type MIME/plain: " https://routingnumbers.herokuapp.com/api/data.json?rn=071000013&callback=angular.callbacks._ ". angular.min.js: 97
  2. SyntaxError non capturée: jeton inattendu:

Mais si vous vérifiez la réponse dans chrome devtools - NETWORK, c'est correct: Bien que je sache que jsonp renverra la réponse à l'intérieur de jsonpfunction ({"MyJson": "Data"}) où il se bloque.

Voici le code d'origine:

//$scope.number = '071000013';
var routingApiUrl = 'https://routingnumbers.herokuapp.com/api/data.json?rn=' + $scope.number;
$http({
    method: 'jsonp',
    url: routingApiUrl + '&callback=JSON_CALLBACK',
    responseType: "json"
}).
success(function(data){
    console.log('Success: ' + data);
}).
error(function(data){
    console.log('Error: ' + data);
});

Quelqu'un at-il utilisé cette API avec angular? Je suppose qu'il peut y avoir quelque chose que je peux faire (sans jquery) pour modifier les en-têtes, mais je n'ai pas pu trouver d'informations. Je pense également que cela pourrait être un problème de serveur (bien que, s'il fonctionne correctement dans jquery, ce ne serait pas le problème). Peut-être que cela pourrait être quelque chose avec HTTPS

TL: DR - Angular JSONP ne fonctionne pas, mais avec la même URL, la requête jQuery JSONP fonctionne. En référence au code ci-dessus, que me manque-t-il?

Toute aide serait géniale!

MODIFIER: De la ponctuation et des trucs.

jqueryjsonangularjsjsonpangular-http
18
dannypaz

selon cette question: Comment se débarrasser de Uncaught SyntaxError: Jeton inattendu: essayez d'ajouter angular.callbacks._0 (JSON) autour de votre appel json côté serveur. ça a marché pour moi

C'était le plongeur http://plnkr.co/edit/oX2UQRBA41FIHpwAP6AA

6
Raymond Ativie