“您在此页面上多次包含 Google Maps API”错误

Question

我的 html 页面中有以下内容：

    <script type="text/javascript"
            src="http://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false">
    </script>
    <script 
        async defer
        src="https://maps.googleapis.com/maps/api/js?key=hUnDAdjYG_Wz7u2qL6unHqfBOmvaZ0H1Mg&callback=initMap">
    </script>

第一个链接用于 Google 的 API Geometry Library ，第二个链接初始化并绘制地图。

我收到错误消息“您在此页面上多次包含 Google Maps API。这可能会导致意外错误。”

我知道这可以通过仅调用一个脚本并更改参数来解决，请参阅修复“您在此页面上多次包含 Google Maps API。这可能会导致意外错误。” 我不知道如何复制我的问题的答案。

Answer 1

您可以包含一个链接：

<script type="text/javascript"
        src="http://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false&key=AIzaSyBSsKUzYG_Wz7u2qL6unHqfBOmvaZ0H1Mg&callback=initMap">
</script>

基本上合并两个链接中的 url 参数。

Answer 2

有同样的问题困扰了我很长时间。 我的情况是结合 initMap 加载地图和 Google Places API 以列出输入搜索的自动完成功能。

这是我对此的解决方案。

1. 我放在 initMap() 中的自动完成功能

function activatePlacesSearch() { var input = document.getElementById('inputValue'); var autocomplete = new google.maps.places.Autocomplete(input); } activatePlacesSearch();

2. 在 index.html 中：

src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY&libraries=places&callback=initMap"></script>

所以最好的解决办法是：

a) 将两个脚本合二为一

b) 如果可能，将 sensro 功能放在 initMap 中。