Google Street View API CORS Problem beim Zugriff auf Street View von localhost mit Angular 2

Question

Ich erhalte den folgenden Fehler beim Zugriff auf die Panoramen. Ich stoße zufällig auf diesen Fehler. Wie manchmal passiert es und manchmal kann es nicht jemand bitte erarbeiten, wie kann ich das lösen.

Fehler: Der Zugriff auf Image unter 'https://lh3.ggpht.com/-GEWinvnWrN8/VgoOwiNcv2I/AAAAAAAAA3w/vhFJX1VOvr4fDNV2JmKDPhUUx08MeBqdwCJkC/x0-y0-z0/p' vom Ursprung 'localhost: 4200' wurde durch die CORS-Richtlinie blockiert: Auf der angeforderten Ressource ist kein 'Access-Control-Allow-Origin'-Header vorhanden. Origin 'localhost: 4200' ist daher nicht erlaubt. Die Antwort hatte den HTTP-Statuscode 403.

Ich habe diesen CORS-Fehler beim Zugriff auf eine API erhalten, die ich auch mit DRF erstellt habe. Aber später habe ich es mit einer Middleware in meiner API gelöst. Es klingt für mich nicht logisch, dass Google mir nicht erlaubt, auf die Bilder zuzugreifen, wenn es nicht auf derselben Domain ist. Ich arbeite an Angular 2. das ist der Code, den ich anrufe, wenn der Benutzer x = lat und y = lon eingibt.

var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 15, 
      center: {lat: this.x, lng: this.y} 
      }); 
    var panorama = new google.maps.StreetViewPanorama(
       document.getElementById('pano'), { 
        position: {lat: this.x, lng: this.y}, 
        pov: { 
        heading: 34, 
        pitch: 10 
        } 
       }); 
    var cafeMarker = new google.maps.Marker({ 
         position: {lat: this.x, lng: this.y}, 
         map: map, 
         icon: 'https://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=cafe|FFFF00', 
         title: 'Canteen' 
        }); 
        panorama.addListener('position_changed', function() { 
       console.log(panorama.getPosition().lat() +" " + panorama.getPosition().lon()); 
      }); 

map.setStreetView(panorama);` 

Answer 1

Überprüfen Sie Ihre Referenz auf Google-API in index.html Es sollte sein:

src="https://maps.google.com/maps/api/js?key=YOUR-KEY"> 

(die http bemerken S)