Google Maps JavaScript API RefererNotAllowedMapError


122

Kami mencoba mengembangkan aplikasi geoplacement untuk salah satu klien kami, dan kami ingin mengujinya terlebih dahulu di domain sendiri.

Kami telah menandatangani Google Maps JavaScript API, dan kami memiliki kunci browser yang valid dan domain kami, www.grupocamaleon.com, telah diberi otorisasi untuk menggunakan kunci itu.

Tetapi kami tidak dapat membuat bahkan contoh termudah untuk dijalankan tanpa kesalahan.

Kami memiliki, di domain kami dan dengan kunci kami, demo berikut:

(1) http://www.grupocamaleon.com/boceto/aerial-simple.html

Tetapi itu tidak berhasil, dan konsol Firebug mengatakan:

"Kesalahan API Google Maps: Kesalahan API Google Maps: RefererNotAllowedMapError (tautan ke dokumentasi Google di RefererNotAllowedMapError) URL situs Anda yang akan diotorisasi: (1)"

Halaman kredensial saya kehilangan kemungkinan menambahkan perujuk untuk diterima, jadi solusi yang melibatkan penambahan perujuk tidak mungkin dilakukan saat ini.

Halaman kredensial saya:

masukkan deskripsi gambar di sini

Mengapa kami mendapatkan kesalahan itu? Bagaimana cara memperbaikinya?


Kemungkinan duplikat dari perujuk API peta Google tidak diperbolehkan . Kode Anda berfungsi untuk saya (dengan kunci saya), jadi ada yang salah dengan kunci Anda, perujuk yang diizinkan, atau layanan yang diaktifkan untuk menggunakannya.
geocodezip

Tetapi saya tidak memiliki kemungkinan seperti itu di halaman kredensial saya, seperti yang Anda lihat dalam jawaban saya di sini. Ada petunjuk?
Grupo Camaleón Creativos

Yah, saya seorang pemula dan saya belum tahu bagaimana menggunakan situs ini dengan benar. Maaf atas ketidaknyamanan ini. Saya telah mengedit pertanyaan saya, menambahkan informasi pada halaman kredensial saya. Beberapa solusi yang dikutip melibatkan penambahan perujuk, apa yang tidak dapat saya lakukan saat ini.
Grupo Camaleón Creativos

Jika Anda tidak dapat mengubah perujuk untuk kunci tersebut, hapus atau ganti dengan yang Anda kontrol. Kunci tidak diperlukan, tetapi ada manfaat untuk menyertakannya.
geocodezip

1
Saya membuat kunci baru tanpa batasan APP atau API, katanya expiredKey selama 10 menit, lalu mulai bekerja. Selanjutnya saya mencoba menambahkan hanya Places API, tetapi itu dipanggil dari web dan berkata: Google Maps JavaScript API error: RefererNotAllowedMapErrorbahkan setelah menunggu. Kemudian saya mencoba Maps JavaScript APIdan terus berkata RefererNotAllowedMapError, mencoba menyegarkan halaman dan akhirnya mulai berfungsi setelah 2 menit 40 detik. Jadi hati-hati. Tapi TANPA apapun TIDAK berhasil untuk saya, dan begitu juga Maps JavaScript APIhanya. Anda hanya harus menunggu lama.
psiko brm

Jawaban:


168

Saya tahu ini adalah pertanyaan lama yang sudah memiliki beberapa jawaban, tetapi saya memiliki masalah yang sama dan bagi saya masalahnya adalah saya mengikuti contoh yang diberikan di console.developers.google.com dan memasukkan domain saya dalam format tersebut *.domain.tld/*. Ini tidak bekerja sama sekali, dan saya mencoba menambahkan semua jenis variasi untuk ini seperti domain.tld, domain.tld/*, *.domain.tlddll

Apa yang memecahkannya bagi saya adalah menambahkan protokol yang sebenarnya juga; http://domain.tld/*adalah satu-satunya yang saya perlukan agar berfungsi di situs saya. Saya rasa saya perlu menambahkan https://domain.tld/*jika saya beralih ke HTTPS.

Pembaruan: Google akhirnya memperbarui placeholder untuk disertakan httpsekarang:

Bidang masukan perujuk Google Maps API


1
Saya mengonfirmasi: satu-satunya kombinasi yang memungkinkan saya menggunakan API adalahhttp://www.---.com/*
Marco Panichi

6
Jawaban ini adalah satu-satunya yang membuat kode saya berfungsi. Saya dapat mengonfirmasi bahwa contoh yang diberikan Google tidak berfungsi.
Jargs

1
Terima kasih, @Google, karena telah memberi kami informasi palsu. http://----.com/* adalah format yang benar.
Michael Yaeger

2
Jika Anda memiliki beberapa sub domain, Anda dapat melakukannya, http: //*.example.com dan https: //*.example.com untuk mencakup semua basis
tim.baker

1
Mungkin Google memperbarui fitur itu - bagi saya ini berfungsi tanpa protokol. Saya ada example.com/*di bidang pengaturan, dan berfungsi darihttps://example.com/map
Andy

21

Ayo Google, kalian lebih pintar dari halaman Kredensial API yang memungkinkan. (Saya tahu karena saya memiliki dua putra yang bekerja di sana.)

Daftar "perujuk" jauh lebih pemilih daripada yang diizinkan. (Tentu saja, ini harus lebih memaafkan.) Berikut beberapa aturan yang membutuhkan waktu berjam - jam untuk saya temukan:

Mungkin ada aturan lain, tapi ini adalah permainan menebak yang membosankan.


1
Tentang jawaban sebelum edit, saya kehabisan kesabaran juga. Sepertinya karakter pengganti (*) hanya berfungsi di akhir alamat ( http://my.site.com/*) atau di subdomain ( http://*.site.com). Dalam SEMUA kasus lain itu tidak berhasil
Cristian Traìna

1
Saya telah salah menempatkan batasan untuk hanya mengizinkan Places API (tab tepat di sebelah batasan perujuk). Ini menghasilkan kesalahan RefererNotAllowedMapError yang sama.
Matt Greer

Menambahkan www. untuk nama domain saya memperbaikinya untuk saya. Saya tidak yakin apakah menambahkan wildcard (*) ke akhir domain, seperti (https://www.my-site.com/*)juga telah memperbaiki masalah.
Mugé

aplikasi seluler ionik saya memiliki domain sebagai ionik: // app # / tab. Bagaimana saya memasukkannya ke dalam batasan. Saya mencoba banyak kombinasi tetapi sia-sia. Contoh: ionic: // app # / tabs, httpionic: // app # / tabs, httpsionic: // app # / tabs, ionic: // *, ionic: // app # / *, httpionic: // *, ......
AUK4SO

@ AUK4SO - Tanda pagar ( #) memiliki arti khusus di url. Lihat <a name=...>. Atau maksud Anda iconic://1234/foo?
Rick James

18

Menurut dokumentasi, 'RefererNotAllowedMapError' artinya

URL saat ini yang memuat Google Maps JavaScript API belum ditambahkan ke daftar perujuk yang diizinkan. Silakan periksa pengaturan perujuk kunci API Anda di Google Developers Console.

Saya memiliki Google Maps Embed API yang disiapkan untuk penggunaan pribadi / pekerjaan saya dan sejauh ini belum menentukan perujuk HTTP apa pun. Saya mendaftar tidak ada kesalahan. Pengaturan Anda harus membuat Google berpikir bahwa URL yang Anda kunjungi tidak terdaftar atau tidak diizinkan.

masukkan deskripsi gambar di sini


15

Hanya ingatkan bahwa jika Anda hanya mengubahnya, mungkin diperlukan waktu hingga 5 menit agar setelan diterapkan.


15

Saya mencoba banyak variasi perujuk dan menunggu 5 menit juga sampai saya menyadari bahwa contoh yang diisi Google di bidang formulir cacat. Mereka menunjukkan:

*.example.com/*

Namun itu hanya berfungsi jika Anda memiliki subdomain.atau www.di depan nama domain Anda. Yang berikut langsung berfungsi untuk saya (dengan menghilangkan titik awal dari contoh Google):

*example.com/*

9
Ide buruk - seseorang dapat membuat hackexample.comdan menggunakan api Anda
HyderA

3
@HyderA - Kemungkinan yang lebih mungkin adalah seseorang akan mendaftarkan banyak akun google gratis untuk mendapatkan beban peta tambahan.
ow3n

@HyderA mereka masih membutuhkan kuncinya, jadi bukan peluang besar. Tapi Anda benar, masih memiliki potensi risiko.
Eoin

aplikasi seluler ionik saya memiliki domain sebagai ionik: // app # / tab. Bagaimana saya memasukkannya ke dalam batasan. Saya mencoba banyak kombinasi tetapi sia-sia. Contoh: ionic: // app # / tabs, httpionic: // app # / tabs, httpsionic: // app # / tabs, ionic: // *, ionic: // app # / *, httpionic: // *, ......
AUK4SO

10

Menurut Google Docs ini terjadi karena urldi mana Anda menggunakan Google Maps API, itu not registereddilist of allowed referrers

EDIT:

Dari Google Docs

Semua subdomain dari domain tertentu juga diotorisasi.

Jika http://example.com diotorisasi, maka http://www.example.com juga diotorisasi. Kebalikannya tidak benar: jika http://www.example.com diotorisasi, http://example.com belum tentu diotorisasi

Jadi, Silakan konfigurasikan http://testdomain.comdomain, maka Anda http://www.testdomain.comakan mulai bekerja.


Dalam kasus saya, itu adalah DNS yang salah dikonfigurasi untuk domain. Misalnya: www.testdomain.com berfungsi dengan baik testdomain.com tidak berfungsi menyebabkan kesalahan
Tahir Khalid

1
Tampaknya logika itu terbalik? Kecuali saya melewatkan sesuatu.
twobob

10

Pastikan Anda juga mengaktifkan APIS yang benar.

Semua cara diatas sudah saya coba, asterisk, domain tlds, forward slashes, backslashes dan semuanya, bahkan pada akhirnya hanya memasukkan satu url sebagai harapan terakhir.

Semua ini tidak berhasil dan akhirnya saya menyadari bahwa Google juga mengharuskan Anda menentukan sekarang API mana yang ingin Anda gunakan (lihat tangkapan layar)

masukkan deskripsi gambar di sini

Saya tidak memiliki yang saya butuhkan diaktifkan (bagi saya itu adalah Maps JavaScript API)

Setelah saya mengaktifkannya, semuanya bekerja dengan baik menggunakan:

http://www.example.com/ *

Saya harap itu membantu seseorang! :)



8

Saya menemukan bahwa bahkan penyebab Anda HTTP Referrerescukup valid dan salah .API RestrictionsGoogle Maps JavaScript API error: RefererNotAllowedMapError

Sebagai contoh:

  • Anda menggunakan Javascript API untuk kunci tersebut.
  • Tambahkan http://localhost/*keApplication Restrictions / HTTP Referrences
  • Pilih, Maps Embed APIbukanMaps Javascript API
  • Ini menyebabkan RefererNotAllowedMapError

Ya, dalam kasus saya, kesalahan klasifikasi adalah masalahnya
Andriy F.

Tapi bagaimana dengan keamanannya? Adakah yang bisa menggunakan kunci saya di localhost jika saya mengizinkan untuk localhost?
Kaushal

5

Ada banyak solusi yang seharusnya selama beberapa tahun, dan beberapa tidak berfungsi lagi dan beberapa tidak pernah berhasil, jadi data terbaru saya bekerja per akhir Juli 2018.

Mempersiapkan:

Google Maps JavaScript API harus bekerja dengan baik dengan…

  • beberapa domain yang memanggil API: example.comdanexample.net
  • subdomain sewenang-wenang:, user22656.example.comdll.
  • protokol HTTP yang aman dan standar: http://www.example.com/danhttps://example.net/
  • struktur jalur tak terbatas (yaitu sejumlah besar jalur URL berbeda)

Larutan:

  • Benar-benar menggunakan pola dari placeholder: <https (or) http>://*.example.com/*.
  • Tidak menghilangkan protokol, tetapi menambahkan dua entri per domain (satu per protokol).
  • Entri tambahan untuk subdomain (dengan *.memimpin nama host).
  • Saya merasa bahwa RefererNotAllowedMapErrorkesalahan masih muncul menggunakan konfigurasi yang tepat (dan telah menunggu cukup lama). Saya menghapus kunci kredensial, mengulangi permintaan (sekarang mendapatkanInvalidKeyMapError ), membuat kredensial baru (menggunakan pengaturan yang sama persis), dan itu berfungsi sejak saat itu.
  • Menambahkan protokol dan domain belaka sepertinya belum memasukkan subdomain.
  • Untuk salah satu domain, konfigurasi kerjanya terlihat seperti ini:

Tangkapan layar dari konfigurasi Google API

(Sebagai teks :)

Accept requests from these HTTP referrers (web sites)
    https://*.example.com/*
    https://example.com/*
    http://*.example.com/*
    http://example.com/*

Dalam kasus saya, solusi ini membantu tetapi memiliki Pembatasan API pada API yang salah. Untuk beberapa alasan, pesan kesalahan yang sama dikembalikan. Mengubah Pembatasan API dari 'Places API' menjadi 'Maps Javascript API' memperbaiki masalah ini.
LMG

4

masukkan deskripsi gambar di sini

Terima permintaan dari perujuk HTTP ini (situs web)

Tulis jalur direktori localhost


3
menurut teks Google itu seharusnya menjadi properti opsional dan jika kosong seharusnya berfungsi
ejectamenta

@ayanchakraborty - Saya telah mencoba 10 kombinasi berbeda dari localhost / index.html (dan berbagai jalur) serta berbagai kombinasi file: ///android_assets/www/index.html - tetapi tidak ada yang berhasil. RefererNotAllowedMapError di konsol menunjukkan kepada saya: URL situs Anda untuk diotorisasi: __file_url __ // android_asset / www / index.html # / tab / map //// `- tetapi ini dan variasi tidak berfungsi juga.
rolinger

4

Saya mengalami kesalahan yang sama:

masukkan deskripsi gambar di sini

Tautan ini membahas tentang cara menyiapkan batasan kunci API: https://cloud.google.com/docs/authentication/api-keys#adding_http_restrictions

Dalam kasus saya, masalahnya adalah saya menggunakan batasan ini:

Perujuk HTTP (situs web) Terima permintaan dari perujuk HTTP ini (situs web) (Opsional) Gunakan * untuk karakter pengganti. Jika Anda membiarkannya kosong, permintaan akan diterima dari perujuk mana pun. Pastikan untuk menambahkan perujuk sebelum menggunakan kunci ini dalam produksi. https://*.example.net/*

Artinya, URL seperti https://www.example.net atau https://m.example.net atau https://www.example.net/San-salvador/ akan berfungsi. Namun, URL seperti https://example.net atau https://example.net atau https://example.net/San-salvador/ tidak akan berfungsi. Saya hanya perlu menambahkan perujuk kedua:

https://example.net/*

Itu memperbaiki masalah saya.


4

Saya menambahkan 2 domain situs web, menetapkan "*" di subdomain tidak berfungsi tetapi subdomain tertentu "WWW" dan non-subdomain telah berfungsi untuk situs web saya menggunakan kunci API Google Map yang sama.

jangan gunakan "*" di subdomain

Semoga membantu.


3

Anda menampilkan screenshot halaman kredensial api Anda, tetapi Anda harus mengklik "Browser key 1" dan pergi dari sana untuk menambahkan referer.


3

Untuk halaman bersarang yang lebih dalam

Jika Anda memiliki proyek dalam folder misalnya atau halaman bersarang

http://yourdomain.com/your-folder/your-page Anda dapat memasukkan ini

http://yourdomain.com/*/*

Bagian yang penting /*/*/* tergantung seberapa jauh Anda harus melangkah

Tampaknya *tidak akan cocok/ atau masuk ke jalur yang lebih dalam ..

Ini akan memberikan akses domain penuh Anda, kecuali Anda memiliki tingkat yang lebih dalam dari itu ..


3

Tidak satu pun dari perbaikan ini yang berhasil untuk saya sampai saya mengetahui bahwa hal itu RefererNotAllowedMapErrordapat disebabkan oleh tidak adanya akun penagihan yang ditautkan ke proyek. Jadi, pastikan untuk mengaktifkan uji coba gratis Anda atau apa pun.


3
  1. Bahwa penagihan Anda diaktifkan

  2. Bahwa situs web Anda telah ditambahkan ke Konsol Google

  3. Bahwa situs web Anda ditambahkan ke perujuk di aplikasi Anda.

  4. (lakukan karakter pengganti untuk www dan tidak ada www)

http://www.example.com/ * dan http://example.com/ *

  1. Peta Javascript itu diaktifkan dan Anda menggunakan kredensial yang benar

  2. Bahwa situs web telah ditambahkan ke DNS Anda untuk mengaktifkan Konsol Google Anda di atas.

  3. Tersenyumlah setelah berhasil!


Daftar perujuk yang diizinkan dapat ditemukan di konsol web Google Cloud Platform (console.cloud.google.com) di bawahAPIs & Services > Credentials > (your key) > Application restrictions > HTTP Referrers
Master of Ducks

3

Ini adalah produk Google licik lainnya dengan penerapan yang buruk.

Masalah yang saya temukan dengan ini adalah bahwa jika Anda membatasi kunci API berdasarkan alamat IP, itu tidak akan berfungsi ... TAPI jauh dari Google untuk memperjelas hal ini ... Tidak sampai pemecahan masalah dan penelitian saya menemukan:

Kunci API dengan batasan alamat IP hanya dapat digunakan dengan layanan web yang dimaksudkan untuk digunakan dari sisi server (seperti Geocoding API dan API Layanan Web lainnya). Sebagian besar layanan web ini memiliki layanan yang setara dalam Maps JavaScript API (misalnya, lihat Layanan Geocoding). Untuk menggunakan layanan sisi klien Maps JavaScript API, Anda perlu membuat kunci API terpisah yang dapat diamankan dengan pembatasan perujuk HTTP (lihat Membatasi kunci API).

https://developers.google.com/maps/documentation/javascript/error-messages

FFS Google ... Bagian informasi yang cukup penting yang sebaiknya diklarifikasi saat penyiapan ...



2

Saya akhirnya bekerja dengan menggunakan tip ini dari Google: ( https://support.google.com/webmasters/answer/35179 )

Berikut adalah definisi kami tentang domain dan situs. Definisi ini khusus untuk verifikasi Search Console:

http://example.com/ - A site (because it includes the http:// prefix)
example.com/ - A domain (because it doesn't include a protocol prefix)
puppies.example.com/ - A subdomain of example.com
http://example.com/petstore/ - A subdirectory of http://example.com site

2

Saya juga kesulitan untuk membuat ini berhasil, tetapi berikut beberapa petunjuknya:

  • URL yang ditetapkan sebagai perujuk termasuk http, misalnyahttp://example.com/*
  • Google Maps JavaScript API telah diaktifkan
  • Penagihan telah disiapkan di akun ini

Setelah semua ini di atas diselesaikan, peta ditampilkan seperti yang diharapkan.


1

Saya mencoba menggunakan Places API (Autocomplete) dan juga harus mengaktifkan Maps Javascript API dari dalam Google Cloud Console sebelum Places API berfungsi.


0

Periksa deklarasi Anda di situs. Untuk memuat Google Maps JavaScript API, gunakan tag script seperti ini

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"
async defer></script>

Saya menggunakan deklarasi ini di situs Wordpress saya dalam file function.php

wp_enqueue_script("google-maps-v3", "//maps.google.com/maps/api/js?key=YOUR_API_KEY", false, array(), false, true);

Saya telah menetapkan kunci API pada format ini, dan berfungsi dengan baik

http://my-domain-name(without www).com/*

deklarasi ini tidak berfungsi

*.my-domain-name.com/*

0

Menghapus batasan (ke Tidak Ada) berhasil untuk saya.


6
menghapus batasan dianggap praktik buruk dan membuat API Anda rentan.
mtness

2
@mtness ya jelas tetapi poster sudah mencobanya terlebih dahulu tanpa hasil. Sayangnya dokumentasi Google tidak lagi membantu. Setiap jawaban di sini membawa tip baru, ini hampir seperti permainan menebak ...
James Wong - Kembalikan Monica


0

Konsol Javascript Chrome menyarankan agar saya mendeklarasikan seluruh alamat halaman dalam daftar perujuk HTTP saya, dalam contoh ini http://mywebsite.com/map.htm Meskipun alamat tepatnya adalah http://www.mywebsite.com/map.htm - Saya sudah memiliki gaya wildcard terdaftar seperti yang disarankan oleh orang lain tetapi ini adalah satu-satunya cara itu akan berhasil untuk saya.


0

Ini berhasil untuk saya. Ada 2 kategori utama pembatasan di bawah pengaturan kunci api:

  • Application restrictions
  • API restrictions

Pembatasan aplikasi:

Di bagian bawah di bagian Perujuk tambahkan url situs web Anda " http://www.grupocamaleon.com/boceto/aerial-simple.html ". Ada contoh aturan di sisi kanan bagian berdasarkan berbagai persyaratan.

Pembatasan aplikasi

Pembatasan API:

Di bawah batasan API, Anda harus secara eksplisit memilih 'Maps Javascript API' dari daftar dropdown karena kunci unik kami hanya akan digunakan untuk memanggil Google maps API (mungkin) dan menyimpannya seperti yang Anda lihat pada snap di bawah ini. Saya harap ini berhasil untuk Anda ..... berhasil untuk saya

masukkan deskripsi gambar di sini

Periksa Script Anda:

Juga masalah mungkin muncul karena pemberian kunci yang tidak tepat di dalam tag skrip. Seharusnya seperti ini:

  <script async defer src="https://maps.googleapis.com/maps/api/jskey=YOUR_API_KEY&callback=initMap"
  type="text/javascript"></script>
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.