异步加载 Google 地方

Question

由于我要在移动应用中使用谷歌地图和地点，我不希望任何东西减慢应用加载速度。

我发现在边缘网络上，我的应用程序启动速度非常慢。我所有的 js 都是本地的，所以只有谷歌地图和地点需要很长时间才能加载（如果我从 html 文件中删除地图和地点，加载速度很快）。

index.html
<script>....</script>
<script src='http://maps.google.com/maps/api/js?key=mykey&amp;sensor=false'></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&amp;sensor=false"></script>
</body>

我在Load google maps v3 dynamically with ajax找到了如何异步下载谷歌地图：

$.getScript("http://maps.google.com/maps/api/js?key=mykey&sensor=false&async=2&callback=MapApiLoaded", function () {});

function MapApiLoaded() {
   $.ajaxSetup({async:false});
   $.getScript("http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false");
   $.ajaxSetup({async:true});
   alert('loading places done');
}

我收到警报并检查 $.getScript() 是否成功返回，但是当我尝试使用地点时，我在 javascript 控制台中收到以下错误：谷歌地图地点未定义。

我尝试只在 html 文件中添加位置并异步加载 Google 地图，但它也不起作用。

有什么想法吗？提前谢谢你。

Answer 1

您加载了两次 Maps API。只需执行一次，包括地点库：

$.getScript("http://maps.google.com/maps/api/js?key=mykey&libraries=places&sensor=false&callback=MapApiLoaded");

function MapApiLoaded() {
    alert('loading Maps API and Places library done');
}