2017-02-28 1 views
1

Bonjour, je suis assez nouveau pour Angular js. J'essaye de consommer le service Web qui est conçu pour renvoyer des données au format JSON, je l'appelle à partir du fichier js local sur localhost (WAMP). Webservice est conçu dans la plate-forme .net. J'ai utilisé jsonp car je suis en train d'utiliser le webservice interdomaines.Obtenir "Uncaught SyntaxError: Jeton inattendu:" lors de la tentative de consommer le service web interdomaine en utilisant jsonp dans AngularJS

Mon code AngularJS est comme ceci:

var app = angular 
       .module("myModule",[]) 
       .controller("myController",function($scope,$http,$sce,$log){ 
        var url = "http://somevalid_api_url"; 
        url=$sce.trustAsResourceUrl(url); 
        $http.jsonp(url, {jsonpCallbackParam: 'callback'}) 
        .then(function(data){ 
         console.log(data); 
        }); 

       }); 

La réponse pour api est comme ceci:

{ 
    "deviceId":null, 
    "id":1, 
    "isNewUser":"\u0000", 
    "message":"Sucess", 
    "playlistId":0, 
    "userId":0, 
    "privacyPolicy":"<p style=\"box-sizing: border-box; margin: 0px 0px 12.5px; color: rgb(0, 0, 0); font-family: wf_segoe-ui_normal, Tahoma, Verdana, Arial, sans-serif; font-size: 16px;\">\u000d\u000a\u0009Your privacy is important to us. This privacy statement explains what personal data we collect from you and how we use it. We encourage you to read the summaries below and to click on &quot;Learn More&quot; if you&#39;d like more information on a particular topic.<\/p>\u000d\u000a<p style=\"box-sizing: border-box; margin: 0px 0px 12.5px; color: rgb(0, 0, 0); font-family: wf_segoe-ui_normal, Tahoma, Verdana, Arial, sans-serif; font-size: 16px;\">\u000d\u000a\u0009The product-specific details sections provide additional information relevant to particular Microsoft products. This statement applies to the Microsoft products listed below, as well as other Microsoft products that display this statement. References to Microsoft products in this statement include Microsoft services, websites, apps, software and devices.<\/p>\u000d\u000a", 
    "termAndCondition":"<p>\u000d\u000a\u0009<span style=\"color: rgb(51, 51, 51); font-family: Georgia, &quot;Times New Roman&quot;, serif; font-size: 18px;\">Terms and Conditions are a set of rules and guidelines that a user must agree to in order to use your website or mobile app. It acts as a legal contract between you (the company) who has the website or mobile app and the user who access your website and mobile app.<\/span><\/p>\u000d\u000a", 
    "termsId":1 
} 

Dans la console de navigateur se erreur suivant:

Uncaught SyntaxError: Unexpected token : 

Lorsque je clique sur l'erreur que je reçois détails suivants: Image of details in console

ce qui signifie qu'il est d'avoir un problème du côlon (:) qui est immédiatement après « deviceId ».

J'ai essayé des solutions à partir des liens suivants, mais n'a pas fonctionné pour moi:

parsing JSONP $http.jsonp() response in angular.js

AngularJS cross-domain requests using $http service

Cross-domain $http request AngularJS

AngularJS Uncaught SyntaxError: Unexpected token :

ont essayé sur deux versi ons de Angualr Js v1.6.2 et v1.5.1, mais échoué sur les deux.

force I compris quoi que ce soit de la solution suivante: Angularjs JSONP not working

Je serai vraiment reconnaissant si quelqu'un peut aider ou me guider à travers cela.

+0

L'erreur est due au fait que le format de réponse est JSON, pas JSONP, et qu'ils ne sont pas interchangeables. Je suppose que vous avez fait cela pour contourner l'erreur 'No Access Control header' lors de votre demande de domaine croisé, non? –

+0

@Rory McCrossan Oui. Webservice renvoie JSON. Je n'ai pas réussi à le faire en utilisant get method car mon script d'appel est sur ma machine locale, et le web-service est sur un serveur pas sur ma machine locale, donc j'ai parcouru beaucoup d'articles et j'ai trouvé que je devais utiliser jsonp comme ça est un scénario inter-domaines. Donc, de meilleures suggestions ?? –

+0

Si vous avez accès au serveur, vous devez modifier la réponse pour inclure les en-têtes CORS afin que les demandes inter-domaines soient autorisées. Si vous n'avez pas accès au serveur, vous ne pourrez pas faire de requêtes à cette API à partir du code JS, vous devrez le faire dans un langage côté serveur, tel que PHP ou C# –

Répondre

1

Parce que ce n'est pas un format JSONP, une réponse JSONP sera ressembler à ceci:

mycallback({ user: 'wang' }); 

pas comme JSON normal:

{ user: 'wang' } 

Vous aurez besoin d'un côté serveur pour faire JSONP, pas seulement le codage Front-End.