Menggunakan kunci API

Produk Google Maps Platform dilindungi dari penggunaan yang tidak sah dengan membatasi panggilan API ke panggilan yang memberikan kredensial autentikasi yang tepat. Kredensial ini berbentuk kunci API - string alfanumerik unik yang mengaitkan akun penagihan Google dengan project Anda, dan dengan API atau SDK tertentu.

Panduan ini menunjukkan cara membuat, membatasi, dan menggunakan Kunci API untuk Google Maps Platform.

Sebelum memulai

Sebelum mulai menggunakan Maps JavaScript API, Anda harus memiliki project dengan akun penagihan dan Maps JavaScript API yang aktif. Untuk mempelajari lebih lanjut, lihat Menyiapkan project di Konsol Cloud.

Membuat kunci API

Kunci API adalah ID unik yang mengautentikasi permintaan terkait project untuk tujuan penggunaan dan penagihan. Anda harus memiliki setidaknya satu kunci API terkait project.

Untuk membuat kunci API:

Konsol

  1. Buka halaman Google Maps Platform > Credentials.

    Buka halaman Credentials

  2. Pada halaman Credentials, klik Create credentials > API key.
    Dialog API key created akan menampilkan kunci API yang baru dibuat.
  3. Klik Close.
    Kunci API baru dicantumkan pada halaman Credentials di bawah API keys.
    (Jangan lupa untuk membatasi kunci API sebelum menggunakannya dalam produksi.)

Cloud SDK

gcloud alpha services api-keys create \
    --project "PROJECT" \
    --display-name "DISPLAY_NAME"

Baca selengkapnya tentang Google Cloud SDK, Penginstalan Cloud SDK, dan perintah berikut:

Membatasi kunci API

Google sangat menyarankan agar Anda membatasi penggunaan kunci API hanya untuk API yang diperlukan aplikasi Anda. Membatasi kunci API akan meningkatkan keamanan aplikasi Anda dengan melindunginya dari permintaan yang tidak sah. Untuk informasi selengkapnya, lihat Praktik terbaik keamanan API.

Cara membatasi kunci API:

Konsol

  1. Buka halaman Google Maps Platform > Credentials.

    Buka halaman Credentials

  2. Pilih kunci API yang ingin Anda batasi. Halaman properti kunci API akan muncul.
  3. Di bagian Key restrictions, tetapkan pembatasan berikut:
    • Pembatasan aplikasi:
      1. Untuk menerima permintaan dari daftar situs yang Anda berikan, pilih HTTP referers (web sites) dari daftar Application restrictions.
      2. Tentukan satu atau beberapa situs perujuk. Anda dapat menggunakan karakter pengganti untuk mengizinkan semua subdomain (misalnya, https://*.google.com menerima semua situs yang berakhiran .google.com saat diakses melalui HTTPS). Perhatikan bahwa jika Anda menentukan www.domain.com, URL ini akan berfungsi sebagai www.domain.com/* dengan karakter pengganti, dan akan mengizinkan subjalur apa pun pada nama host tersebut. Tentukan skema perujuk https:// dan http:// sesuai default-nya. Untuk protokol URL lainnya, Anda harus menggunakan representasi khusus. Misalnya, format file:///path/to/ sebagai __file_url__//path/to/*. Setelah mengaktifkan situs, pastikan untuk memantau penggunaan Anda guna memastikan kecocokannya dengan perkiraan Anda. Protokol berikut didukung: about://, app://, applewebdata://, asset://, chrome://, content://, file://, ftp://, ionic://, local://, ms-appx://, ms-appx-web://, ms-local-stream://, prism://, qrc://, res://, saphtmlp://.
    • Pembatasan API:
      1. Klik Restrict key.
      2. Pilih Maps JavaScript API dari menu dropdown Select APIs. Jika Maps JavaScript API tidak tercantum, Anda harus mengaktifkannya.
      3. Jika project Anda menggunakan Places Library, pilih juga Places API. Selain itu, jika project Anda menggunakan layanan lain di JavaScript API (Layanan Directions, Layanan Distance Matrix, Layanan Elevation, dan/atau Layanan Geocoding), Anda juga harus mengaktifkan dan memilih API yang sesuai dalam daftar ini.
  4. Untuk menyelesaikan perubahan, klik Save.

Cloud SDK

Cantumkan kunci yang ada.

gcloud services api-keys list --project="PROJECT"

Hapus pembatasan yang berlaku pada kunci yang ada.

gcloud alpha services api-keys update "projects/PROJECT/keys/KEY_ID" \
    --clear-restrictions

Tetapkan pembatasan baru pada kunci yang ada.

gcloud alpha services api-keys update "projects/PROJECT/keys/KEY_ID" \
    --api-target="maps-backend.googleapis.com"
    --allowed-referrers="referer"

Baca selengkapnya tentang Google Cloud SDK, Penginstalan Cloud SDK, dan perintah berikut:

Menambahkan kunci API ke permintaan

Anda harus menyertakan kunci API bersama setiap permintaan Maps JavaScript API. Pada contoh berikut, ganti YOUR_API_KEY dengan kunci API Anda.

<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>