谷歌地图javascript API“；“地理定位服务失败”；在服务器中，但在本地

因此，我设置了一个ngrok临时服务器，向我的雇主展示她的网站的外观，但随后我注意到google map的Javascript API在ngrok上失败，而在我的本地主机上它工作时，这是ngrok的一个怪癖，还是当我们开始在真正的服务器上托管它时会发生？ 我在/scripts/js/geolocation.js上有geolocation，调用它的页面在/orders.php上

geolocation.js：

function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
        center: {lat: -34.397, lng: 150.644},
        zoom: 6
    });
    var infoWindow = new google.maps.InfoWindow({map: map});

    // Try HTML5 geolocation.
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(position) {
            var pos = {
                lat: position.coords.latitude,
                lng: position.coords.longitude
            };

            infoWindow.setPosition(pos);
            infoWindow.setContent('Location found.');
            map.setCenter(pos);
        }, function() {
            handleLocationError(true, infoWindow, map.getCenter());
        });
    } else {
        // Browser doesn't support Geolocation
        handleLocationError(false, infoWindow, map.getCenter());
    }
}

function handleLocationError(browserHasGeolocation, infoWindow, pos) {
    infoWindow.setPosition(pos);
    infoWindow.setContent(browserHasGeolocation ?
        'Error: The Geolocation service failed.' :
        'Error: Your browser doesn\'t support geolocation.');
}

orders.php：

<div id="map">
    <script>initMap()</script>
</div>


<script async defer
        src="https://maps.googleapis.com/maps/api/js?key=REDACTED&callback=initMap">
</script>

initMap（）

本地主机：

韩国：

---

对于将来可能需要帮助的人：

问题在@AwPa、@RamRaider、@HaythamROUIS的帮助下解决。 因此，问题是服务器使用的是http而不是https，您需要做的唯一一件事是（如果您使用的是ngrok）将https://放在url的开头，因为ngrok同时托管http和https，或者将Web服务器的配置更改为使用https

ngrok上的https链接：

---

重要提示：如@RamRaider所说，使用URL获取的所有内容，最好不要硬编码将要使用的协议，这样做将使用网站上当前使用的协议，在本例中为https。

您在console中查看了吗？您是否收到任何错误消息？我还建议您从StackOverflow中删除API密钥，以防有人决定将其用于邪恶目的。也许，为

geolocation.getCurrentPosition

提供

options

参数和合适的值可能有助于改进结果-使用

watchPosition

方法也可能有用，我不确定这是否是原因，但是您是否在您的google开发者帐户中激活了google maps javascript api？我认为问题在于您的google api密钥仅限于您的本地主机域，您能否验证开发者帐户中允许的域，并添加您与NGROK一起使用的域您可能会发现使用

@RamRaider很有帮助谢谢，我会把它添加到我的代码中，我也会把它添加到答案中。