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 diaktifkan. Untuk mempelajari lebih lanjut, lihat Menyiapkan project di Cloud Console.

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. Karakter pengganti boleh digunakan untuk memberi otorisasi semua subdomain (misalnya, *.google.com menerima semua situs yang diakhiri dengan .google.com). Tentukan https:// dan http:// sebagaimana mestinya. Anda harus menggunakan representasi khusus untuk jenis protokol URL perujuk lainnya. Misalnya, format file:///path/to/ sebagai __file_url__//path/to/*. Setelah mengaktifkan perujuk, pastikan untuk memantau penggunaan Anda untuk memastikan kecocokannya dengan perkiraan Anda. Protokol perujuk 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 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 ada 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_HERE",
    // Add other bootstrap parameters as needed, using camel case.
    // Use the 'v' parameter to indicate the version to load (alpha, beta, weekly, etc.)
  });
</script>