webentwicklung-frage-antwort-db.com.de

Hoppla! Etwas ist schief gelaufen. Diese Seite hat Google Maps nicht richtig geladen. Technische Details finden Sie in der JavaScript-Konsole

Hoppla! Etwas ist schief gelaufen ... Diese Seite hat Google Maps nicht richtig geladen. Technische Details finden Sie in der JavaScript-Konsole.

ich weiß nicht warum 

API-Fehler: RefererNotAllowedMapError

<!DOCTYPE html>
<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <style>
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
      #map {
        height: 100%;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script>
      var map;
      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -34.397, lng: 150.644},
          zoom: 8
        });
      }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=myAPI&callback=initMap"
    async defer></script>
  </body>
</html>

3

Schauen Sie sich das Google Maps-Tutorial an: https://developers.google.com/maps/documentation/javascript/tutorials/adding-a-google-map

Wenn Sie sorgfältig lesen, werden Sie feststellen, dass ein Schlüssel, YOUR_API_KEY, benötigt wird

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

Den Schlüssel erhalten Sie hier: https://developers.google.com/maps/documentation/javascript/tutorials/adding-a-google-map#key

6
AD.

Ich hatte das gleiche Problem, als ich versuchte, Google Maps API zu verwenden. Ich habe dieselbe Nachricht, um in die JavaScript-Konsole zu gelangen. Was für eine Zeitverschwendung!

In meinem Fall bestand das Problem darin, dass ich den Domainnamen (den Referrer) falsch eingetippt hatte, als ich den Browser-API-Schlüssel von Google erhielt.

Die Behebung des Namens der verweisenden Domain ( http://phystutor.com/ *) auf der Google API-Site hat das Problem für mich gelöst. 

4
PhysTutor

Ich hatte das gleiche Problem, als ich eine Site auf einem neuen Host mit einer Seite live geschaltet hatte, die eine eingebettete Karte enthielt, die zuvor nicht auf der Site gewesen war. Die Karte hatte auf meiner Entwicklungsseite funktioniert, daher war auch ich eine Überraschung. 

Wenn Sie bei einer Google-Suche auf dieser Seite gelandet sind, möchten Sie hier beginnen: https://developers.google.com/maps/documentation/javascript/get-api-key .

Wenn Sie die Ankündigung zur API-Schlüsselanforderung lesen möchten, lesen Sie Folgendes: https://googlegeodevelopers.blogspot.com/2016/06/building-for-scale-updates-to-google.html

Beachten Sie auch, dass in meinem Fall "&callback=initMap" einen Fehler verursacht hat.

1
Webdrips

Ersetzen Sie Ihr googleApi maps plugin mit diesem ...

" https://maps.googleapis.com/maps/api/js?sensor=false&callback=initMap "

<!DOCTYPE html>
<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <style>
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
      #map {
        height: 100%;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script>
      var map;
      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -34.397, lng: 150.644},
          zoom: 8
        });
      }
    </script>
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&callback=initMap"></script>

  </body>
</html>

Ich hoffe es funktioniert für Sie.

1
Nandam Mahesh

In der Google Maps-Dokumentation finden Sie verschiedene Fehlercodes: https://developers.google.com/maps/documentation/javascript/error-messages#deverrorcodes

Der obige Fehlercode wird in der Dokumentation wie folgt beschrieben:

Die aktuelle URL, die das Google Maps JavaScript API lädt, lautet nicht zur Liste der erlaubten Verweise hinzugefügt. Bitte überprüfen Sie den Referrer Einstellungen Ihres API-Schlüssels in der Google API Console.

Bitte überprüfen Sie den Link zur Kartendokumentation auf Fehlermeldungen, um weitere Informationen zu erhalten.

Google Maps erfordert jetzt die Verwendung eines Google Maps-API-Schlüssels, um eine Karte auf Ihrer Website gemäß diesem Artikel anzuzeigen: https://googlegeodevelopers.blogspot.co.za/2016/06/building-for-scale-updates- to-google.html.

0
dwerty