Google Maps API 大改版前必知,網站需因應調整的 3 大步驟

Google Maps API大改版前必知,網站需因應調整的3大步驟

2018 年 6 月 11 日起 Google Maps API 將改版為 Google Maps Platform,由於收費方式調整,如果沒有取得 API 金鑰或成為付費用戶,都會使地圖在 6 月 11 日起被變更為低解析度並出現提示訊息浮水印。該怎麼調整才不會被影響呢?跟著步驟來確認吧!

Google Maps API 改版為 Google Maps Platform

Google Maps API 即將於 2018 年 6 月 11 日起進行近幾年來最大的一次改版,並相應更名為 Google Maps Platform。

Google Maps API 統整為三大項目

改版為 Google Maps Platform 後,既有的數十種 Google Maps API 將被統整為三大項目:地圖(Maps)、路線(Routes)、地點(Places),並簡化開發者使用 Google Maps 的流程,讓調用 API 更為輕鬆。

另外,改版後現有的 Google Maps API 代碼不會受影響,將可以繼續使用,對開發者而言是一項好消息。

照片為 Google Maps API 統整為三大項目,從左至右依序為Maps、Routes、Places
Google Maps Platform 的三大項目,詳細更新內容請參考官方資訊

Google Maps API 收費方式調整

Google Maps API 的收費方式也隨著大改版而有變動,6 月 11 日起使用 Google Maps 無論用量是否超出每月 200 美金的免費額度,都必須成為 Google Cloud Platform 的付費用戶、並取得有效的 API 金鑰,否則原本使用中的 Google Maps 將被改為低解析度並出現提示訊息浮水印。

每月 200 美金的免費額度用量根據使用的 Google Maps API 而有不同,以最常運用於網站地圖的「Static Maps」為例,每個月的免費用量為 100,000 loads,超過用量後,0~100,000 loads 的費用為 $2.00(每千次);100,001-500,000 loads 的費用為 $1.60(每千次)。

如果想要預估新制上線後每月可能產生的費用,如果已經在使用 Google Maps 金鑰,可以登入該專案確認每月用量;如果無法從專案中確認,建議可以觀看 Google Analytics 紀錄確認有使用 Google Maps 的網頁頁面瀏覽量(Page Views)。

照片為 Google Maps API 收費方式調整
地圖(Maps)的最新的收費方式,完整收費方式請參考官方的價格表

網站需因應調整的 3 大步驟

要怎麼檢查網站上的 Google 地圖會不會受影響?又該怎麼調整呢?

請跟著以下步驟進行:

步驟一、確認網站中的 Google Maps 是否有設定金鑰

照片為步驟一、確認網站中的 Google Maps 是否有設定金鑰1

  • 在有設定 Google Maps 的網頁中,點擊 Google Maps Platform API Checker 進行確認。
  • 如果經確認有金鑰,請繼續前往步驟二繼續下一步驟的檢查。
照片為步驟一、確認網站中的 Google Maps 是否有設定金鑰 2
有金鑰會出現「SUCCESS」的訊息,並在 JS API Call 中顯示設定的金鑰(圖片中馬賽克處)
  • 如果確認沒有金鑰,請跳到步驟三開始進行設定。
照片為步驟一、確認網站中的 Google Maps 是否有設定金鑰 3
沒有金鑰會出現包含「This site doesn’t seem to be using an API key.」的 ERROR 訊息

步驟二、確認 Google Maps 的金鑰帳戶是否已經有綁定帳戶資訊

  • 登入當初申請 Google Maps API 金鑰的 Google 帳戶
  • 確認帳戶狀況
  • 如果經確認帳戶已經綁定付費資訊,恭喜,你無須進行任何調整!
照片為確認 Google Maps 的金鑰帳戶是否已經有綁定帳戶資訊 1
付費資訊已設定時,會出現包含「The billing for this project is in good shape.」的提示訊息
  • 如果經確認帳戶尚未綁定付費資訊,請點擊「Add Billing」跟隨指示設定。

照片為確認 Google Maps 的金鑰帳戶是否已經有綁定帳戶資訊 2
未設定付費資訊時,會出現包含「This project does not have a billing account.」的提示訊息
  • 如果已經遺忘當初申請的帳戶是哪一個,請跳到步驟三開始進行設定。

步驟三、設定新的 Google Maps 專案、產生金鑰並更新語法

照片為設定新的 Google Maps 專案、產生金鑰並更新語法

  • 選擇 Google Maps API 的類型(在這邊以 Maps 做示範),點擊「CONTINUE」

照片為設定新的 Google Maps 專案、產生金鑰並更新語法2

  • 選擇既有專案名稱或是建立新專案,點擊「NEXT」

照片為設定新的 Google Maps 專案、產生金鑰並更新語法3

  • 點擊「建立帳單帳戶」,跟隨提示填妥帳戶資訊

照片為設定新的 Google Maps 專案、產生金鑰並更新語法4

  • 取得 Google Maps 金鑰

    設定完畢會跳出啟用 Google 地圖平台的訊息,Google Maps 的金鑰也會同時出現,點擊一下右側的複製保存

照片為設定新的 Google Maps 專案、產生金鑰並更新語法5

  • 將 Google Maps 的網站語法加入金鑰

    各網站語法不盡相同,一般來說網站地圖會使用的語法如下:

    <script src=”https://maps.googleapis.com/maps/api/js”></script>

    請將語法更換如下,並把 XXXXXXXXXXXXX 替換為真正的金鑰:

    <script src=”https://maps.googleapis.com/maps/api/js?key=XXXXXXXXXXXXX”></script>

  • 恭喜,你已經完成替換了!

Google Maps API 的應用非常廣泛,除了最常見的網站地圖外,線上訂房網、遊戲、APP 等各領域的開發者都有可能應用,在 2018 年 6 月 11 日的 Google Maps Platform 大改版前記得做好確認,以免時間一到,Google Maps 被改成低解析度又加上浮水印喔!