要訪問Google maps api，我何時需要使用以下腳本？

Question

<script type="text/javascript" src="http://maps.google.com/maps/api/js"></script>

和

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

在上面的腳本中，區別在於API密鑰。 我注意到使用和不使用API​​ KEY的代碼示例。 它說谷歌地圖Javascript API 2需要API密鑰，谷歌地圖Javascript API 3不需要密鑰。 但是在腳本中我們沒有提到它應該訪問哪個版本的API。 那有什么區別？

Answer 1

此腳本在沒有API密鑰的情況下加載Google Maps Javascript API的實驗版本 ：

<script type="text/javascript" src="http://maps.google.com/maps/api/js"></script>

此腳本使用API​​密鑰異步加載Google Maps Javascript API的實驗版本：

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

• API密鑰允許跟蹤使用情況，並允許您在需要時購買額外的配額。

對於async defer和callback參數，從這個問題的答案： 頁面速度 - 簡單地使用延遲屬性的任何問題？

異步 ：您可以通過在現代瀏覽器上使用async屬性來阻止腳本在加載期間阻止

defer ：defer屬性表示在頁面DOM完全加載之前根本不加載。 延遲意味着異步。

使用Google Maps API時，必須在異步加載API時使用回調參數。 這會導致api在內部使用動態腳本插入而不是document.write調用。 您也可以指定一個空的回調參數。