2017-06-21 1 views
0

So richte ich einen Ngrok temporären Server, um meinem Arbeitgeber zu zeigen, wie ihre Website sucht, aber dann bemerkt, dass Google Map Javascript API während auf Ngrok, während auf mein localhost es funktioniert, ist das eine komik mit ngrok oder wird es passieren, wenn wir beginnen, es auf einem echten server hosten? Ich habe die Geolocation auf /scripts/js/geolocation.js und die Seite, die es auf /orders.phpGoogle Maps Javascript API "Geolocation-Service fehlgeschlagen" in Server aber funktioniert auf lokaler

geolocation.js ruft:

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> 

Localhost: Local:

Ngrok: Ngrok

+2

Haben Sie einen Blick in die Konsole geworfen? Erhalten Sie Fehlermeldungen? – Nat

+1

Ich würde auch vorschlagen, dass Sie Ihren API-Schlüssel aus StackOverflow entfernen, nur für den Fall, dass jemand sich entscheidet, ihn für bösen Gebrauch zu verwenden. – Nat

+1

Vielleicht kann das 'options' Argument zu' geolocation.getCurrentPosition' mit geeigneten Werten helfen, die Ergebnisse zu verbessern - auch die Verwendung der 'watchPosition' Methode könnte von Nutzen sein – RamRaider

Antwort

1

Für die Zukunft von jemandem, die Hilfe bei dieser als gut brauchen könnte:

Frage mit Hilfe von @AwPa gelöst, @RamRaider, @HaythamROUIS. Also das Problem war, dass der Server in http statt https war, das einzige, was Sie tun müssen, ist (wenn Sie ngrok verwenden) https: // am Anfang der URL, da ngrok Hosts sowohl http und https bei der Gleichzeitig ändern Sie die Konfiguration Ihres Webservers, um HTTPS zu verwenden.

https-Link auf ngrok: ngrok

Wichtiger Hinweis: Wie @RamRaider sagte, Verwendung, tun dies mit allem, was Sie URL Fetch, ist es besser, nicht um das Protokoll zu codieren, der verwendet wird, es zu tun Auf diese Weise wird das Protokoll verwendet, das derzeit auf der Website verwendet wird, in diesem Fall https.

+1

Es kann hilfreich sein, '

Verwandte Themen