2016-11-24 1 views
2

Ich versuche JSONP zu verwenden, um die gleiche Ursprungsrichtlinie zu umgehen, aber soweit ich es verstanden habe, habe ich den erwähnten Fehler Der Server gibt keine JSONP-Antwort zurück. Aber wenn ich json als meine datatype verwenden dann bekomme ich ein „XMLHttpRequest kann nicht geladen werden, Nein 'Access-Control-Allow-Origin-Header auf die angeforderte Ressource vorhanden ist,“ Hier ist mein Code:Uncaught SyntaxError: Unerwartetes Token: Wenn JSONP verwendet wird und XMLHttpRequest nicht geladen werden kann, wird nur JSON verwendet

$.ajax({ 
     url : "https://maps.googleapis.com/maps/api/place/nearbysearch/json? location=-33.86,151.195&radius=5000&type=ATM&keyword=ATM&key=MyAPIKey", 
     type : "GET", 
     dataType: 'jsonp', 
     success:function(data){ 
     console.log(data); 
     } 
    }) 

A ähnliches Problem kann hier gefunden werden [json Uncaught SyntaxError: Unexpected token :] aber diente nur dazu, zu verstehen, was vor sich geht, anstatt das Problem zu lösen. Ich bin relativ neu, also bitte ich eine Schritt-für-Schritt-Anleitung, um dies zu lösen.

Mit demselben Problem auf Chrom und Firefox.

Antwort

0

Sie scheinen den Rückruf Namen zu fehlen, einen zusätzlichen Parameter „Typ“ ist, und nicht mit der ‚Daten‘ Parameter, um die Anfrage params weitergeben müssen:

https://learn.jquery.com/ajax/working-with-jsonp/

EDIT: ich getroffen habe einen genaueren Blick auf Ihren Code und versuchte es in Plunker. Ich habe dies versucht:

$(function(){ 
$.ajax({ 
     url : "https://maps.googleapis.com/maps/api/place/nearbysearch/json", 
     data:{ 
     location:"-33.86,151.195", 
     radius:"5000", 
     type:"ATM", 
     keyword:"ATM", 
     key:"MyAPIKey" 

     }, 
     dataType: 'jsonp', 
     success:function(data){ 
     console.log(data); 
     }, 
     error:function(data){ 
     console.log("err",data); 
     } 
    }) 
}); 

Was ich zurück bekam, war ein Fehler, die Ihre API-Schlüssel nicht korrekt ist (OFC, es ist nicht). Wenn Sie jedoch den richtigen Schlüssel eingeben, funktioniert der JSONP-Aufruf immer noch nicht, da die von Ihnen aufgerufene API Ihnen nicht JSONP, sondern JSON zurückgibt. (wie Sie am Ende der URL sehen können).

Die Serverseite sollte JSONP speziell unterstützen, um es verwenden zu können, da es die Antwort in ein Skript schreiben soll, das einen Rückruf mit Daten ausgibt. So

:

  • ajax JSONP Aufruf arbeitet

  • gegebenen Server-Ressource nicht zurück JSONP

Der Fehler, den Sie sehen das Ergebnis Ihrer Anwendung versucht, auszuführen Ergebnis JSON als Skript.

EDIT2:

Im Allgemeinen "Access-Control-Allow-Origin" Header vom Server in der Antwort gesetzt. Wenn die Herkunft Ihrer Referrerseite nicht mit der Einstellung in dieser Kopfzeile übereinstimmt, wird der Browser das tun, was er jetzt tut. Sie können es in der Anfrage nicht kontrollieren.

See for reference on CORS

Its all serverseitige/unter der Haube in Browser. Aber es gab eine ähnliche Frage hier:

(Eine andere Frage zum gleichen Thema) Access-Control-Allow-Origin using Google Maps JavaScript API v3.

Versuchen Sie, Googles-Bibliothek zu verwenden, wenn Sie können. Vielleicht führt sie einen anderen Aufruf durch, bevor sie die Ressource anfordert, die CORS von Ihrer Site aus zu aktivieren.

+0

Ich habe das versucht, aber immer noch das gleiche Problem. Irgendwelche Vorschläge? Danke! .. hier ist mein neuer Code: $.Ajax ({ url: "https://maps.googleapis.com/maps/api/place/nearbysearch/json?location=-33.86,151.195&radius=5000&type=ATM&keyword=ATM&key=AIzaSyAmqJGpDDSMVZimLQ3yPeLKHqqd7VVmmNg", JSONP: "Rückruf" , Datentyp: "JSONP" Daten: { Format: "json" }, success: function (response) { console.log (response); // server Antwort } }); –

+0

pls. siehe den bearbeiteten Teil der Antwort. Ihre Ressource ist JSON-Ressource und nicht JSONP –

+0

Vielen Dank. Ihre Erklärung ist sehr sinnvoll. Zusammenfassend kann ich JSONP einfach nicht verwenden, da der Server dies nicht unterstützt. Also muss ich JSON verwenden. Aber ich bleibe bei einem anderen Problem stecken, wenn ich JSON benutze: "XMLHttpRequest kann nicht geladen werden, kein 'Access-Control-Allow-Origin'-Header ist auf der angeforderten Ressource vorhanden" Haben Sie eine Idee, wie könnte ich dieses Problem bei JSON umgehen? ? Vielen Dank! –

Verwandte Themen