谷歌地图API错误:MissingKeyMapError - 我确实有它但它无法识别

时间:2018-03-23 16:02:56

标签: javascript jquery google-maps jquery-ui jquery-mobile

我有谷歌API密钥,但浏览器没有认识到这一点。您可以访问我的网站:rodcurvelo.com,点击联系人,您会看到错误。

浏览器也说:

  

您已在此页面上多次添加Google Maps API。这可能会导致意外错误

这是我的代码:

         <div class="map-area" id="map-contact">
          <script async defer src="http://maps.googleapis.com/maps/api/js?libraries=geometry&ampsensor=false&ampkey=AIzaSyDwPJ1GDAq8GFIQmlMYyRFId7wRtQTFUF8"></script>
         </div>

       <div class="hidden map-contact-body">
        <div class="map-content">
          <h4 class="no-margin-top font-alt">Iam Here</h4>
          <p><i class="fa fa-map-marker"></i> <strong>Address:</strong> 8723 Bogor, West Java</p>
          <p><i class="fa fa-mobile"></i> <strong>Phone:</strong> 87-3898-221 </p>
          <p><i class="fa fa-envelope"></i> <strong>Email:</strong> someone@company.com</p>
        </div>
      </div>
      <!--END MAP-->
      <!-- maps js -->
       <script src="http://maps.googleapis.com/maps/api/js?sensor=false"type="text/javascript"></script>
       <script src="assets/plugins/jquery.ui.map.js"></script> 


      //theme.js
      //Run function When Document Ready
      $(document).ready(function() {
         initMap();

      });

          //Map
          function initMap() {
          $('#map-contact').gmap({
          'center': '27.867473, -82.637582',
          'zoom': 15,
           scrollwheel: false,
          'disableDefaultUI': false,
          'callback': function() {
          var self = this;
          self.addMarker({
           'position': this.get('map').getCenter(),
            icon: 'assets/theme/images/marker.png'
            }).click(function() {
            self.openInfoWindow({
            'content': $('.map-contact-body').html()
          }, this);
        });
       }
     });
    }

1 个答案:

答案 0 :(得分:0)

您需要两次Google Maps API;

<script async defer src="http://maps.googleapis.com/maps/api/js?libraries=geometry&ampsensor=false&ampkey=AIzaSyDwPJ1GDAq8GFIQmlMYyRFId7wRtQTFUF8"></script>

并且:<script src="http://maps.googleapis.com/maps/api/js?sensor=false"type="text/javascript"></script>

尝试将它们连接在一起(请参阅:Fixing "You have included the Google Maps API multiple times on this page. This may cause unexpected errors."

此外,我并不完全确定你是否使用了async defer,据我所知它是script asyncscript defer,而不是两者:)