Warum funktioniert meine Google Maps-API-Anfrage nicht, wenn ich sie auf einem Server ausfühle?

Question

Ich versuche einen Weg zu finden, die Verkehrsdistanz von einem Ort zum anderen zu berechnen. Ich habe ein Skript gefunden, das perfekt in meinem Browser funktioniert, aber wenn ich es auf meinen Webserver hochlade und es dann öffne.

Es funktioniert nicht.

Ich habe einen Schlüssel von Google bekommen, kann aber nicht herausfinden, wie man ihn zum Skript hinzufügt. Hier

ist der eigentliche Code

var directionsService = new google.maps.DirectionsService(); 
 

 
var request = { 
 
    origin  : 'amsterdam', 
 
    destination : 'rome', 
 
    travelMode : google.maps.DirectionsTravelMode.DRIVING 
 
}; 
 

 
directionsService.route(request, function(response, status) { 
 
    if (status == google.maps.DirectionsStatus.OK) { 
 
    var output = response.routes[0].legs[0].distance.value; 
 
    document.getElementById("dump").innerHTML = output; 
 
    
 
    } 
 
    else { 
 

 
    } 
 
});

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script> 
 
<p id="dump"></p>

Answer 1

Sie die Google Maps API Schlüssel in der Abfragezeichenfolge der URL angeben können, in dem src Attribut des script tag:

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&key=YOUR_API_KEY"></script>