只有提供正確驗證憑證的使用者可以呼叫 API，這樣可以防止有人未經授權使用 Google 地圖平台產品。上述憑證採用 API 金鑰的形式，API 金鑰是不重複的英數字元字串，可將您的 Google 帳單帳戶與專案建立關聯，以及與特定 API 或 SDK 建立關聯。
本指南說明如何建立、限制及使用 Google 地圖平台的 API 金鑰。
事前準備
您必須擁有已連結帳單帳戶的專案，並啟用 Maps JavaScript API，才能開始使用 Maps JavaScript API。請參閱這篇文章，進一步瞭解如何在 Cloud 控制台中完成相關設定。
建立 API 金鑰
API 金鑰是一組專屬 ID，用於驗證與您專案有關的使用權限及帳單處理要求。您的專案至少要有一個相關聯的 API 金鑰。
建立 API 金鑰的方法如下：
控制台
-
前往「Google 地圖平台」>「憑證」頁面。
-
在「憑證」頁面上，點選「建立憑證」>「API 金鑰」。
「建立的 API 金鑰」對話方塊會顯示您新建立的 API 金鑰。 -
按一下「關閉」。
新建立的 API 金鑰會出現在「憑證」頁面的「API 金鑰」下方。
(別忘了先為 API 金鑰設定限制，然後才在正式環境中使用)
Cloud SDK
gcloud alpha services api-keys create \
--project "PROJECT" \
--display-name "DISPLAY_NAME"
進一步瞭解 Google Cloud SDK、Cloud SDK 安裝和下列指令：
限制 API 金鑰
Google 強烈建議您設定限制，只允許將 API 金鑰用於應用程式需要的 API。限制 API 金鑰可避免不必要的請求使用 API 金鑰，有助提升應用程式的安全性。詳情請參閱「API 安全性最佳做法」。
限制 API 金鑰的方法如下：
控制台
-
前往「Google 地圖平台」>「憑證」頁面。
- 選取要設定限制的 API 金鑰，畫面隨即顯示 API 金鑰屬性頁面。
- 在「金鑰限制」下方，設定下列限制：
- 應用程式限制：
- 如要接受由您提供的網站清單中所列的要求，請從「應用程式限制」清單中選取「HTTP 參照網址 (網站)」。
- 指定一或多個參照網址網站。您可以使用萬用字元為所有子網域授權 (舉例來說，
https://*.google.com接受結尾為.google.com的所有網站 (如果是透過 HTTPS 存取))。請注意，如果指定了 www.domain.com，系統就會將這個網址視為加上萬用字元的版本 www.domain.com/* 來使用，該主機名稱上的任何子路徑也都會獲得授權。依照原樣指定https://和http://參照網址配置。如果是其他網址通訊協定，您必須使用特別的表示法。舉例來說，您可以將file:///path/to/的格式設為__file_url__//path/to/*。啟用網站後，請務必監控您的使用情況，確保符合預期。支援的通訊協定如下：about://、app://、applewebdata://、asset://、chrome://、content://、file://、ftp://、ionic://、local://、ms-appx://、ms-appx-web://、ms-local-stream://、prism://、qrc://、res://、saphtmlp://。 - API 限制：
- 如要完成變更，請按一下「儲存」。
Cloud SDK
列出現有金鑰。
gcloud services api-keys list --project="PROJECT"
清除現有金鑰的目前限制。
gcloud alpha services api-keys update "projects/PROJECT/keys/KEY_ID" \
--clear-restrictions
設定現有金鑰的新限制。
gcloud alpha services api-keys update "projects/PROJECT/keys/KEY_ID" \
--api-target="maps-backend.googleapis.com"
--allowed-referrers="referer"
進一步瞭解 Google Cloud SDK、Cloud SDK 安裝和下列指令：
將 API 金鑰加進要求中
每個 Maps JavaScript API 要求都必須包含 API 金鑰。請將下例中的 YOUR_API_KEY 換成您的 API 金鑰。
<script>
(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})({
key: "YOUR_API_KEY",
v: "weekly",
// Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).
// Add other bootstrap parameters as needed, using camel case.
});
</script>