Google Maps JavaScript API RefererNotAllowedMapError

122

Staramy się stworzyć aplikację geoplacement dla jednego z naszych klientów i chcemy najpierw przetestować ją we własnej domenie.

Zarejestrowaliśmy się w Google Maps JavaScript API i mamy prawidłowy klucz przeglądarki, a nasza domena www.grupocamaleon.com została upoważniona do korzystania z tego klucza.

Ale nie możemy zrobić nawet najłatwiejszego przykładu, który działałby bez błędów.

Mamy w naszej domenie i z naszym kluczem następujące demo:

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

Ale to nie działa, a konsola Firebug mówi:

„Błąd interfejsu API Map Google: błąd interfejsu API Map Google: RefererNotAllowedMapError (link do dokumentacji Google w witrynie RefererNotAllowedMapError) Adres URL Twojej witryny do autoryzacji: (1)”

Na mojej stronie uwierzytelniającej brakuje możliwości dodania stron odsyłających do zaakceptowania, więc rozwiązania polegające na dodawaniu odsyłających nie są obecnie możliwe.

Moja strona logowania:

wprowadź opis obrazu tutaj

Dlaczego otrzymujemy ten błąd? Jak możemy to naprawić?

Grupo Camaleón Creativos
źródło
Ewentualny duplikat strony odsyłającej Google Maps API jest niedozwolony . Twój kod działa dla mnie (z moim kluczem), więc coś jest nie tak z Twoim kluczem, dozwolonymi poleceniami lub usługami, z których można z nim korzystać.
geocodezip
Ale nie mam takiej możliwości na mojej stronie z danymi uwierzytelniającymi, co widać w mojej odpowiedzi tutaj. Jakaś wskazówka?
Grupo Camaleón Creativos
Cóż, jestem nowicjuszem i nie wiem jeszcze, jak obecnie korzystać z tej witryny. Przepraszam za niedogodności. Zmieniłem pytanie, dodając informacje na mojej stronie z danymi uwierzytelniającymi. Niektóre z przytoczonych rozwiązań wymagają dodania odsyłaczy, czego w tej chwili nie mogę zrobić.
Grupo Camaleón Creativos
Jeśli nie możesz zmienić stron odsyłających dla klucza, usuń go lub zastąp innym, który kontrolujesz. Klucz nie jest wymagany, ale dołączenie go ma zalety.
geocodezip
1
Utworzyłem nowy klucz bez ograniczeń aplikacji lub API, powiedział, że wygasł klucz przez 10 minut, a następnie zacząłem działać. Następnie próbowałem dodać tylko API Miejsc, ale jest wywoływane z sieci i mówi: Google Maps JavaScript API error: RefererNotAllowedMapErrornawet po czekaniu. Potem spróbowałem Maps JavaScript APIi powtarzało się RefererNotAllowedMapError, próbowałem odświeżyć stronę i w końcu zaczęło działać po 2 minutach i 40 sekundach. Więc uważaj, do diabła. Ale BEZ niczego DZIAŁA dla mnie i działa Maps JavaScript APItylko. Musisz tylko dużo czekać.
psycho brm

Odpowiedzi:

168

Wiem, że to stare pytanie, które ma już kilka odpowiedzi, ale miałem ten sam problem i dla mnie problem polegał na tym, że poszedłem za przykładem podanym na console.developers.google.com i wprowadziłem moje domeny w formacie *.domain.tld/*. To nie działa w ogóle, a ja próbowałem dodając wszystkie rodzaje wariacji na to jak domain.tld, domain.tld/*, *.domain.tlditd.

Rozwiązaniem dla mnie było również dodanie właściwego protokołu ; http://domain.tld/*jest jedynym, którego potrzebuję, aby działał w mojej witrynie. Myślę, że będę musiał dodać, https://domain.tld/*jeśli mam przełączyć się na HTTPS.

Aktualizacja: Google w końcu zaktualizowało symbol zastępczy, aby uwzględnić httpteraz:

Pole wejściowe odsyłacza interfejsu API Map Google

powerbuoy
źródło
1
Potwierdzam: jedyną kombinacją, która pozwoliła mi na użycie API byłohttp://www.---.com/*
Marco Panichi
6
Ta odpowiedź jest jedyną, która spowodowała, że ​​mój kod działał. Mogę potwierdzić, że przykład, który podaje Google, nie działa.
Jargs
1
Dziękujemy @Google za podanie nam fałszywych informacji. http://----.com/* to poprawny format.
Michael Yaeger
2
Jeśli masz wiele subdomen, które możesz zrobić, http: //*.example.com i https: //*.example.com, aby objąć wszystkie bazy
tim.baker
1
Może Google zaktualizował tę funkcję - u mnie działa bez protokołu. Mam example.com/*w ustawieniach pole i działa odhttps://example.com/map
Andy
21

Chodź, Google, jesteście mądrzejsi, niż pozwala na to strona poświadczeń API. (Wiem, bo mam tam dwóch synów).

Lista „odsyłaczy” jest znacznie trudniejsza, niż na to pozwala. (Oczywiście powinno być bardziej wyrozumiałe.) Oto kilka zasad, których odkrycie zajęło mi wiele godzin :

Prawdopodobnie istnieją inne zasady, ale jest to żmudna gra w zgadywanie.

Rick James
źródło
1
Co do odpowiedzi przed edycją, też kończy mi się cierpliwość. Wygląda na to, że symbole wieloznaczne (*) działają tylko na końcu adresu ( http://my.site.com/*) lub w subdomenie ( http://*.site.com). We WSZYSTKICH innych przypadkach to nie działa
Cristian Traìna
1
Błędnie wprowadziłem ograniczenie, aby zezwolić tylko na API Miejsc (zakładka obok ograniczeń strony odsyłającej). Powoduje to ten sam błąd RefererNotAllowedMapError.
Matt Greer,
Dodanie www. do mojej nazwy domeny naprawił to za mnie. Nie jestem pewien, czy dodanie symbolu wieloznacznego (*) na końcu domeny, na przykład (https://www.my-site.com/*), również rozwiązało problem.
Mugé
moja aplikacja mobilna ionic ma domenę ionic: // app # / tabs. Jak bym to uwzględnił w ograniczeniach. Próbowałem wielu kombinacji, ale na próżno. Np .: ionic: // app # / tabs, httpionic: // app # / tabs, httpsionic: // app # / tabs, ionic: // *, ionic: // app # / *, httpionic: // *, ......
AUK4SO,
@ AUK4SO - Znak funta ( #) ma specjalne znaczenie w adresach URL. Zobacz <a name=...>. Czy miałeś na myśli iconic://1234/foo?
Rick James
18

Zgodnie z dokumentacją „RefererNotAllowedMapError” oznacza

Bieżący adres URL wczytujący interfejs API JavaScript Map Google nie został dodany do listy dozwolonych stron odsyłających. Sprawdź ustawienia strony odsyłającej swojego klucza API w Google Developers Console.

Mam interfejs Google Maps Embed API skonfigurowany do użytku osobistego / służbowego i jak dotąd nie wskazałem żadnych odsyłaczy HTTP. Nie rejestruję żadnych błędów. Twoje ustawienia muszą powodować, że Google uważa, że ​​odwiedzany adres URL jest niezarejestrowany lub niedozwolony.

wprowadź opis obrazu tutaj

TRose
źródło
15

Przypomnij tylko, że jeśli tylko to zmienisz, może minąć do 5 minut, zanim ustawienia zaczną obowiązywać.

Putu De
źródło
15

Wypróbowałem wiele odmian strony odsyłającej i czekałem 5 minut, aż zdałem sobie sprawę, że przykład wypełniony przez Google w polu formularza jest błędny. Oni pokazują:

*.example.com/*

Jednak działa to tylko wtedy, gdy masz nazwę swojej domeny subdomain.lub www.przed nią. Następujące rzeczy zadziałały dla mnie natychmiast (pomijając wiodący okres z przykładu Google):

*example.com/*
ow3n
źródło
9
Zły pomysł - ktoś mógłby stworzyć hackexample.comi używać twojego api
HyderA
3
@HyderA - Bardziej prawdopodobne jest, że ktoś zarejestruje kilka bezpłatnych kont Google, aby uzyskać dodatkowe ładowanie map.
ow3n
@HyderA nadal potrzebowaliby klucza, więc nie ma wielkiej szansy. Ale masz rację, nadal istnieje potencjalne ryzyko.
Koniec
moja aplikacja mobilna ionic ma domenę ionic: // app # / tabs. Jak bym to uwzględnił w ograniczeniach. Próbowałem wielu kombinacji, ale na próżno. Np .: ionic: // app # / tabs, httpionic: // app # / tabs, httpsionic: // app # / tabs, ionic: // *, ionic: // app # / *, httpionic: // *, ......
AUK4SO,
10

Zgodnie z dokumentami Google stało się tak, ponieważ urlw którym używasz interfejsu API Map Google, jest to not registeredw formacielist of allowed referrers

EDYTOWAĆ :

Z Dokumentów Google

Autoryzowane są również wszystkie subdomeny określonej domeny.

Jeśli autoryzowana jest witryna http://example.com, autoryzowana jest również witryna http://www.example.com . Odwrotna sytuacja nie jest prawdą: jeśli autoryzowana jest witryna http://www.example.com , http://example.com niekoniecznie jest autoryzowana

Skonfiguruj http://testdomain.comdomenę, wtedy http://www.testdomain.comzaczniesz pracę.

RIYAJ KHAN
źródło
W moim przypadku był to źle skonfigurowany DNS dla domeny. Na przykład: www.testdomain.com działał dobrze testdomain.com nie działał, powodując błąd
Tahir Khalid
1
Wydaje się, że logika jest odwrotna? Chyba że czegoś mi brakuje.
dwa razy
10

Sprawdź również, czy masz włączony poprawny APIS.

Wypróbowałem wszystkie powyższe, gwiazdki, domeny tlds, ukośniki w przód, ukośniki odwrotne i wszystko, nawet na końcu wpisałem tylko jeden adres URL jako ostatnią nadzieję.

To wszystko nie zadziałało i w końcu zdałem sobie sprawę, że Google wymaga również określenia teraz, którego API chcesz użyć (patrz zrzut ekranu)

wprowadź opis obrazu tutaj

Nie miałem włączonych tych, których potrzebowałem (dla mnie był to interfejs API JavaScript Map Google)

Po włączeniu wszystko działało dobrze, używając:

http://www.example.com/ *

Mam nadzieję, że to komuś pomoże! :)

David Robertson
źródło
9

Symbole wieloznaczne (gwiazdki) NIE SĄ dozwolone w części subdomeny.

  • ŹLE: * .example.com / *
  • PRAWO: przyklad.com/*

Zapomnij o tym, co Google mówi o symbolu zastępczym, nie jest to dozwolone.

Daniel Loureiro
źródło
Jak mogę w takim razie dodać: sc.maindomain.com/Survey/UpdateInspection/102
dE Source
1
Możesz ustawić jakosc.maindomain.com/*
Daniel Loureiro
8

Odkryłem, że nawet twoje HTTP Referreressą wystarczająco ważne, zły zestaw API Restrictionsprzyczyn Google Maps JavaScript API error: RefererNotAllowedMapError.

Na przykład:

  • Używasz JavaScript API dla klucza.
  • Dodaj http://localhost/*doApplication Restrictions / HTTP Referrences
  • Wybierz Maps Embed APIzamiastMaps Javascript API
  • To powoduje RefererNotAllowedMapError
hiroshi
źródło
Tak, w moim przypadku problemem była błędna klasyfikacja
Andriy F.
A co z bezpieczeństwem? Czy każdy może używać mojego klucza w localhost, jeśli zezwolę na localhost?
Kaushal
5

Istnieje wiele domniemanych rozwiązań na przestrzeni kilku lat, a niektóre już nie działają, a inne nigdy, dlatego moje aktualne wyniki działają pod koniec lipca 2018 r.

Ustawiać:

Interfejs API JavaScript Map Google musi działać poprawnie z…

  • wiele domen wywołujących API: example.comiexample.net
  • dowolne subdomeny: user22656.example.comitp.
  • zarówno bezpieczne, jak i standardowe protokoły HTTP: http://www.example.com/ihttps://example.net/
  • nieokreślona struktura ścieżek (tj. duża liczba różnych ścieżek URL)

Rozwiązanie:

  • Właściwie przy użyciu wzoru z zastępczy: <https (or) http>://*.example.com/*.
  • Nie pomijając protokołu, ale dodając dwa wpisy na domenę (po jednym na protokół).
  • Dodatkowy wpis dla subdomen (z rozszerzeniem *. nazwą hosta).
  • Miałem wrażenie, że RefererNotAllowedMapErrorbłąd nadal się pojawia przy odpowiedniej konfiguracji (i po odczekaniu wystarczająco dużo czasu). Usunąłem klucz uwierzytelniający, powtórzyłem żądanie (teraz otrzymujęInvalidKeyMapError ), utworzyłem nowe poświadczenia (używając dokładnie tej samej konfiguracji) i od tamtej pory działało.
  • Wydaje się, że dodanie samego protokołu i domeny nie obejmowało subdomen.
  • Dla jednej z domen konfiguracja działająca wygląda następująco:

Zrzut ekranu z konfiguracji Google API

(Jako tekst :)

Accept requests from these HTTP referrers (web sites)
    https://*.example.com/*
    https://example.com/*
    http://*.example.com/*
    http://example.com/*
dakab
źródło
W moim przypadku to rozwiązanie pomogło, ale miało Ograniczenie API na niewłaściwym API. Z jakiegoś powodu został zwrócony ten sam komunikat o błędzie. Zmiana ograniczenia interfejsu API z „Places API” na „Maps Javascript API” rozwiązała problem.
LMG
4

wprowadź opis obrazu tutaj

Akceptuj żądania od tych stron odsyłających HTTP (witryn internetowych)

Wpisz ścieżkę do katalogu hosta lokalnego

Ayan Chakraborty
źródło
3
zgodnie z tekstem Google ma to być właściwość opcjonalna i jeśli jest pusta, powinna działać
ejectamenta
@ayanchakraborty - Wypróbowałem 10 różnych kombinacji localhost / index.html (i różne ścieżki), a także różne kombinacje pliku: ///android_assets/www/index.html - ale nic nie działa. Błąd RefererNotAllowedMapError w konsoli pokazuje mi: Adres URL Twojej witryny do autoryzacji: __file_url __ // android_asset / www / index.html # / tab / map //// `- ale to i odmiany też nie działają.
rolinger
4

Wystąpił ten sam błąd:

wprowadź opis obrazu tutaj

Ten link zawiera informacje o tym, jak skonfigurować ograniczenia klucza API: https://cloud.google.com/docs/authentication/api-keys#adding_http_restrictions

W moim przypadku problem polegał na tym, że korzystałem z tego ograniczenia:

Strony odsyłające HTTP (witryny internetowe) Akceptuj żądania od tych odsyłaczy HTTP (witryn internetowych) (Opcjonalnie) Użyj * dla symboli wieloznacznych. Jeśli pozostawisz to pole puste, żądania będą przyjmowane od każdej strony odsyłającej. Pamiętaj, aby dodać odsyłacze przed użyciem tego klucza w środowisku produkcyjnym. https://*.example.net/*

Oznacza to, że będą działać adresy URL, takie jak https://www.example.net lub https://m.example.net lub https://www.example.net/San-salvador/ . Jednakże, adresy takie jak https://example.net lub https://example.net lub https://example.net/San-salvador/ nie będzie działać. Po prostu musiałem dodać drugą stronę odsyłającą:

https://example.net/*

To rozwiązało problem.

Jaime Montoya
źródło
4

Dodałem 2 domeny internetowe, ustawiłem „*” w subdomenie nie działa, ale dla moich witryn zostały opracowane określone subdomeny „WWW” i inne niż subdomena przy użyciu tego samego klucza Google Map API.

nie używaj „*” w subdomenie

Mam nadzieję, że to pomoże.

Obciąć
źródło
3

pokazujesz zrzut ekranu strony poświadczeń API, ale musisz kliknąć „Klucz przeglądarki 1” i przejść stamtąd, aby dodać strony odsyłające.

ITwrx
źródło
3

Dla głębiej zagnieżdżonych stron

Jeśli masz projekt w folderze, na przykład lub zagnieżdżone strony

http://yourdomain.com/your-folder/your-page możesz to wprowadzić

http://yourdomain.com/*/*

Ważna część jest /*/*/* jak daleko musisz się posunąć

Wygląda na to, że *nie będą pasować/ ani nie wejdą w głębsze ścieżki.

Zapewni to pełny dostęp do domeny, chyba że masz głębsze zagnieżdżenie.

Radmacja
źródło
3

Żadna z tych poprawek nie działała, dopóki nie dowiedziałem się, że RefererNotAllowedMapErrormoże to być spowodowane brakiem połączenia konta rozliczeniowego z projektem. Więc pamiętaj, aby aktywować bezpłatny okres próbny lub cokolwiek innego.

Owen Masback
źródło
3
  1. Że Twoje rozliczenia są włączone

  2. Twoja witryna została dodana do Google Console

  3. Twoja witryna została dodana do stron odsyłających w Twojej aplikacji.

  4. (zrób symbol wieloznaczny dla www i braku www)

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

  1. Włączone są mapy Javascript i używasz poprawnych poświadczeń

  2. Witryna została dodana do Twojego DNS, aby włączyć konsolę Google powyżej.

  3. Uśmiechnij się, gdy to zadziała!

Morris
źródło
Listę dozwolonych stron odsyłających można znaleźć w konsoli internetowej Google Cloud Platform (console.cloud.google.com) w sekcjiAPIs & Services > Credentials > (your key) > Application restrictions > HTTP Referrers
Master of Ducks.
3

To kolejny sh1tty produkt Google ze straszną implementacją.

Problem, który znalazłem w tym przypadku, polega na tym, że jeśli ograniczysz klucz API według adresu IP, to nie zadziała ... ALE Google jest dalekie od wyjaśnienia tej kwestii ... Dopiero po rozwiązaniu problemu i zbadaniu znalazłem:

Klucze API z ograniczeniem adresów IP mogą być używane tylko z usługami internetowymi, które są przeznaczone do użytku po stronie serwera (takimi jak interfejs API geokodowania i inne interfejsy API usług internetowych). Większość z tych usług internetowych ma równoważne usługi w ramach interfejsu API JavaScript Map Google (na przykład zobacz usługę geokodowania). Aby korzystać z usług po stronie klienta Maps JavaScript API, musisz utworzyć oddzielny klucz API, który można zabezpieczyć za pomocą ograniczenia dotyczącego stron odsyłających HTTP (zobacz Ograniczanie klucza API).

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

FFS Google ... Dość ważna informacja, którą dobrze byłoby wyjaśnić podczas konfiguracji ...

php-b-grader
źródło
2

Moja praca wreszcie działa, korzystając z tej wskazówki od Google: ( https://support.google.com/webmasters/answer/35179 )

Oto nasze definicje domeny i witryny. Te definicje są specyficzne dla weryfikacji w 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

źródło
2

Starałem się, aby to również działało, ale oto kilka wskazówek:

  • Adresy URL ustawione jako odsyłające obejmują httpnphttp://example.com/*
  • Włączono interfejs API JavaScript Map Google
  • Na tym koncie skonfigurowano płatności

Po rozwiązaniu tego wszystkiego mapy były wyświetlane zgodnie z oczekiwaniami.

FMCorz
źródło
1

Próbowałem użyć interfejsu Places API (autouzupełnianie) i musiałem również włączyć interfejs API Maps Javascript z poziomu Google Cloud Console, zanim interfejs Places API zaczął działać.

ćwiek
źródło
0

Sprawdź swoją deklarację na miejscu. Aby załadować Google Maps JavaScript API, użyj tagu skryptu, takiego jak ten

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

Używam tej deklaracji na mojej stronie Wordpress w pliku function.php

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

Ustawiłem klucz API na ten format i działa dobrze

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

ta deklaracja nie działa

*.my-domain-name.com/*
Nalaskow
źródło
0

Usunięcie ograniczeń (do Brak) działało dla mnie.

Robot Boy
źródło
6
usunięcie ograniczeń jest uważane za złą praktykę i naraża Twój interfejs API.
mtness
2
@mtness tak, oczywiście, ale plakat już go wypróbował bez powodzenia. Niestety dokumentacja Google nie jest już bardziej pomocna. Każda odpowiedź przynosi nowe wskazówki, to prawie jak gra w zgadywanie ...
James Wong - Przywróć Monikę
0

Konsola JavaScript przeglądarki Chrome zasugerowała, żebym zadeklarował cały adres strony na mojej liście stron odsyłających HTTP, w tym przypadku http://mywebsite.com/map.htm Mimo że dokładny adres to http://www.mywebsite.com/map.htm - Miałem już style symboli wieloznacznych wymienione zgodnie z sugestiami innych, ale był to jedyny sposób, w jaki to zadziałało.

KJB
źródło
0

To zadziałało dla mnie. Istnieją 2 główne kategorie ograniczeń w ustawieniach kluczy interfejsu API:

  • Application restrictions
  • API restrictions

Ograniczenia aplikacji:

Na dole w sekcji Strona odsyłająca dodaj adres URL swojej witryny „ http://www.grupocamaleon.com/boceto/aerial-simple.html ”. Po prawej stronie sekcji znajdują się przykładowe reguły oparte na różnych wymaganiach.

Ograniczenia aplikacji

Ograniczenia API:

W ramach ograniczeń API musisz wyraźnie wybrać „Maps Javascript API” z listy rozwijanej, ponieważ nasz unikalny klucz będzie używany tylko do wywoływania interfejsu API map Google (prawdopodobnie) i zapisywania go, jak widać na poniższym rysunku. Mam nadzieję, że to zadziała dla ciebie ..... zadziałało dla mnie

wprowadź opis obrazu tutaj

Sprawdź swój skrypt:

Problem może również powstać z powodu nieprawidłowego podania klucza w tagu skryptu. Powinien wyglądać mniej więcej tak:

  <script async defer src="https://maps.googleapis.com/maps/api/jskey=YOUR_API_KEY&callback=initMap"
  type="text/javascript"></script>
Tahir77667
źródło