Kunci API Googlemaps untuk Localhost

Bagaimana cara agar kunci api googlemaps berfungsi di localhost?

Saya telah membuat kunci API dan di bawah referensi saya menambahkan yang berikut ini:

Accept requests from these HTTP referrers (websites) (Optional)

Use asterisks for wildcards. If you leave this blank, requests will be 
accepted from any referrer. Be sure to add referrers before using this key 
in production. 

localhost

Ini tidak berfungsi dan jika saya mengecualikan kunci api, itu juga tidak berfungsi?

1. Masuk ke alamat ini: https://console.developers.google.com/apis
2. Buat kunci API untuk proyek Anda
3. Klik pada "Perpustakaan"
4. Klik pada API apa pun yang Anda inginkan
5. Klik "Aktifkan" (kanan atas)
6. Klik "Kredensial"> "Edit Kunci"
7. Di bawah "Pembatasan Kunci", pilih "Perujuk HTTP (situs web)"
8. Ketik alamat situs web Anda (atau "localhost", "127.0.0.1", "localhost: port" dll untuk tes lokal) di bidang teks dan tekan ENTERuntuk menambahkannya ke daftar
9. Gunakan kunci Anda dalam proyek Anda

Anda bisa mengikuti cara ini. Ini bekerja setidaknya untuk saya:

di halaman Kredensial:

1. Pilih opsi dengan alamat IP (opsi no. 3).

2. Masukkan alamat IP Anda dari penyedia Anda. Jika tidak, cari alamat IP Anda dengan menggunakan tautan ini: https://www.google.com/search?q=my+ip

3. Simpan itu.

4. Ubah tautan peta google Anda sebagai berikut di antara tag skrip:

   https://maps.googleapis.com/maps/api/js?libraries=places&key=AIzxxxxxxxx "

5. Tunggu sekitar 5 menit atau lebih untuk membiarkan kunci API Anda menyebar.

Sekarang peta google Anda harus berfungsi.

Jika Anda bekerja di localhost, buat APIkey terpisah untuk pengembangan Anda dan kemudian hapus batasan pada kunci itu sehingga localhost Anda dapat menggunakannya. Ingatlah untuk tidak menggunakan kunci ini pada produksi, jadi Anda tidak mengekspos kunci Anda ke pemburu online.

Saya memiliki masalah yang sama dan semua upaya untuk mendapatkan batasan yang berfungsi di lingkungan localhost saya tidak berhasil sampai saya membuat apikey terpisah khusus untuk pengembangan dan kemudian menghapus batasannya. Namun saya tidak menggunakan kunci itu pada lingkungan produksi, dan setelah selesai dengan pengembangan, saya akan segera menghapus kunci API.

Saya Tahu posting ini terlambat, tetapi untuk orang-orang yang kemungkinan akan menghadapi masalah ini di masa depan, ini adalah rute terbaik untuk ditempuh.

Sepertinya saya agak terlambat ke pesta, dan meskipun saya setuju bahwa membuat kunci terpisah untuk pengembangan (localhost) dan produk dimungkinkan untuk melakukan keduanya hanya dalam 1 kunci.

Saat Anda menggunakan Pembatasan Aplikasi -> referer http -> Pembatasan situs web, Anda dapat memasukkan url karakter pengganti.

Namun menggunakan wildcard seperti .localhost / atau .localhost: {port}. (bila sudah memiliki .yourwebsite.com / * ) sepertinya tidak berfungsi.

Hanya menempatkan satu * tidak berfungsi tetapi ini pada dasarnya memberi Anda kunci tak terbatas yang juga bukan yang Anda inginkan.

Ketika Anda menyertakan path lengkap tanpa menggunakan wildcard * itu juga berfungsi, jadi dalam kasus saya meletakkan:

http: // localhost {port} /
http: // localhost : {port} / something-else / di sini

Membuat peta Google berfungsi secara lokal seperti di www.yourwebsite.com menggunakan kunci API yang sama.

Pokoknya ketika memiliki 2 kunci terpisah juga merupakan pilihan saya akan menyarankan untuk melakukannya.

Anda dapat mengikuti tutorial ini tentang cara menggunakan Google Maps untuk pengujian di localhost.

• Klik tautan ini dan ikuti prosesnya (buat proyek baru, kunci API> Kunci browser, daftarkan domain 'localhost'): https://console.developers.google.com//flows/enableapi?apiid=maps_backend&keyType=CLIENT_SIDE&reusekey=true
• Hasilkan kuncinya
• Terapkan widget Google Maps seperti yang dijelaskan di sini: http://www2.microstrategy.com/producthelp/10/GISHelp/Lang_1033/GIS_Integration.htm
• Tambahkan kunci Google Maps API Anda ke googleConfig.xml (seperti yang dijelaskan di tautan sebelumnya) ENTER_YOUR_KEY_HERE
• Mulai ulang Server Web

Periksa utas SO terkait ini:

• Kunci API Google Maps v3 tidak akan berfungsi untuk pengujian lokal
• Cara menggunakan api sederhana google maps di localhost
• Api Google Maps v3 untuk localhost tidak berfungsi

Semoga ini membantu!

Anda harus memeriksa kesalahan tertentu dalam konsol javascript (mis. Ctrl+ Shift+ KDi Firefox untuk Windows).

Menurut Steven Gliebe (2016) , ada empat kasus umum untuk masalah ini. Jika saya boleh meringkasnya, seperti ini:

1. MissingKeyMapError >> Dapatkan Google Maps API Key (tetapi pertimbangkan juga alternatif no. 2)
2. RefererNotAllowedMapError >> Daftarkan localhost Anda : port di dasbor pengembang google Anda .
3. ApiNotActivatedMapError >> Mengaktifkan Google Maps API di halaman Perpustakaan Google API
4. InvalidKeyMapError >> Tambahkan kunci Anda ke skrip / kode Anda dengan benar

Setelah melakukan beberapa modifikasi kode, harap kosongkan cache browser Anda seperlunya.

Jika ada kesalahan lain, Anda dapat memeriksa halaman Dokumentasi Kode Kesalahan API Google Maps .

Jika tertulis "Terima permintaan dari perujuk HTTP ini (situs web) (Opsional)", Anda tidak perlu mencantumkan perujuk apa pun. Jadi klik X di samping localhost di halaman ini tetapi terus gunakan kunci Anda.

Ini kemudian akan berfungsi setelah beberapa menit.

Perubahan yang dibuat terkadang memerlukan waktu beberapa menit untuk diterapkan, jadi tunggu beberapa menit sebelum menguji lagi.

Mengetik 'IP saya' di pencarian google, saya mendapatkan alamat IP publik saya dan menempelkannya di alamat IP (opsi ketiga). Ini bekerja untuk saya.

Mengetik 'IP saya' di pencarian google, saya mendapatkan alamat IP publik saya dan menempelkannya di alamat IP (opsi ketiga). Ini bekerja untuk saya.