Question

尝试访问全景图时出现以下错误。我随机遇到了这个错误。就像有时它会发生，有时它不会有人请详细说明如何解决这个问题。

错误：来自“localhost：4200”的来自“https://lh3.ggpht.com/-GEWinvnWrN8/VgoOwiNcv2I/AAAAAAAAA3w/vhFJX1VOvr4fDNV2JmKDPhUUx08MeBqdwCJkC/x0-y0-z0/p”的图像访问已被CORS策略阻止：请求的资源上没有“Access-Control-Allow-Origin”标头。因此不允许原点'localhost：4200'访问。响应的HTTP状态代码为403。

我在尝试访问使用DRF构建的API时遇到此CORS错误。但后来我在我的API上使用中间件解决了它。如果Google不在同一个域中，那么谷歌不允许我访问这些图像对我来说听起来不合逻辑。我正在研究Angular 2.这是我在用户输入x = lat和y = lon时调用的代码。

    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

在index.html中检查您对google API的引用它应该是：

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

（注意http S ）

尝试使用Angular 2从localhost访问街景时的Google街景API API问题

1 个答案: