Wie CORS verwenden zu implementieren JavaScript Google Places API-Anfrage

Ich verstehe wirklich nicht, wie ich soll diese Arbeit machen:Wie CORS verwenden zu implementieren JavaScript Google Places API-Anfrage

var requestURL = 'https://maps.googleapis.com/maps/api/place/details/json?placeid=ChIJN1t_tDeuEmsRUsoyG83frY4&key=AIzaSyAW4CQp3KxwYkrHFZERfcGSl--rFce4tNw'; 

console.log(requestURL); 

$.getJSON(requestURL, function(data) { 
    // data 
    console.log(data); 
});

und meine HTML-Datei:

<body> 

     <script 
    src="https://code.jquery.com/jquery-2.2.4.min.js" 
    integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" 
    crossorigin="anonymous"></script> 
     <script src="main.js" charset="utf-8"></script> 
    </body>

ich immer Holen Sie sich die Nein 'Access-Control-Allow-Origin' Header ist auf der angeforderten Ressource vorhanden. Nachricht ... obwohl, wenn ich zu https://maps.googleapis.com/maps/api/place/details/json?placeid=ChIJN1t_tDeuEmsRUsoyG83frY4&key=AIzaSyAW4CQp3KxwYkrHFZERfcGSl--rFce4tNw in meinem Browser gehen, bekomme ich die richtige JSON zurückgegeben.

Ich bin davon überzeugt, dass CORS mir hier helfen kann. Ich verstehe CORS nicht. Bitte, kann mir jemand in einfachen Worten helfen? Was sollte ich ändern, damit dies funktioniert?

Dank

Quelle

2017-02-11 Ryan Mc

Das erste, was ist, wenn Google Places Unterstützung CORS tun zu sehen. Wenn nicht, hat das keinen Sinn. Meine Vermutung ist, dass sie nur JSONP unterstützen, aber überprüfe die Dokumentation. –

Es tut, aber ich bin zu dumm, um einen Sinn davon zu https://developers.google.com/api-client-library/javascript/features/cors –

Ich bin mir nicht sicher, warum dies als ein Duplikat markiert wurde. Es ist eindeutig nicht. –

Sie versuchen die Google Places API Web Service auf Client-Seite zu verwenden, während es für serverseitige Anwendungen ausgelegt ist. Das ist wahrscheinlich der Grund, warum die entsprechenden CORS-Antwortheader nicht vom Server gesetzt werden.

Wie in der Notes at the beginning of the Place Details documentation, sollten Sie die Orte Bibliothek in der Google Maps JavaScript-API verwenden:

Wenn Sie eine clientseitige Anwendung Gebäude sind, werfen Sie einen Blick auf die Google Places API for Android, die Google Places API for iOS, und die Places Library in the Google Maps JavaScript API.

Hinweis: Sie müssen die Google Maps JavaScript API in Ihrem Google Developer Console zuerst aktivieren.

Hier ist eine Art und Weise Sie Platz Details erhalten gehen kann (basierend auf dem example from the documentation):

<head> 
    <script type="text/javascript"> 
     function logPlaceDetails() { 
      var service = new google.maps.places.PlacesService(document.getElementById('map')); 
      service.getDetails({ 
      placeId: 'ChIJN1t_tDeuEmsRUsoyG83frY4' 
      }, function (place, status) { 
      console.log('Place details:', place); 
      }); 
     } 
    </script> 
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAW4CQp3KxwYkrHFZERfcGSl--rFce4tNw&libraries=places&callback=logPlaceDetails"></script> 
</head> 
<body> 
    <div id="map"></div> 
</body>

Quelle

2017-02-12 00:01:09 rd3n

Das scheint gut, aber ein paar Dinge: 1) Sie verwenden ES6 (ich verstehe ES6 noch nicht), 2) es funktioniert nicht für mich, 3) Ich möchte keine Karte, ich möchte nur das Objekt des Ortes zurückgeben so kann ich die Daten in jedem Fall ausgeben. Danke für Ihre Hilfe –

1) Ich habe gerade 'const' durch' var' und '(place, status) =>' nach 'Funktion (place, status)' so ersetzt, dass es keine ES6 mehr gibt, 2) Können Sie das näher erläutern? Haben Sie einen Fehler in der Konsole? 3) Ich bin kein Google Maps-Experte, aber anscheinend können Sie dem 'PlacesService' einen Dom-Knoten anstelle einer Karteninstanz zur Verfügung stellen, sodass keine Karte gerendert wird. Ich habe den Code entsprechend getestet und aktualisiert – rd3n

Ich habe es endlich geschafft, das Beispiel in der Google-Dokumentation zu verbessern. Danke, deine Antwort hat mich in die richtige Richtung gelenkt. –

Wie CORS verwenden zu implementieren JavaScript Google Places API-Anfrage

Antwort

Verwandte Themen