Google Maps JavaScript API RefererNotAllowedMapError

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:

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

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:

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 :

• Kolejność na liście jest ważna. Przeniesienie adresu URL w górę na liście może sprawić, że zadziała.
• Prefiks „http: //” jest wymagany.
• Nawet „localhost” tego potrzebuje: „ http: //localhost/foo/bar.html ”
• Wzdłużny * jako zamiennika wydaje się działać tak, jakby to ciąg porównania.
• Nawet z „ http: //localhost/foo/bar.html ”, „ http: //localhost/foo/bar.html? Arg = 1 ” nie będzie działać. (Czy pomocna będzie wieloznaczna karta?)
• W przypadku obu wersji prod dev należy mieć (co najmniej) dwa wiersze: „ http: //localhost/foo/bar.html ” i „ http://my.site.com/foo/bar.html ”
• Wydaje się, że numer portu (8085? 4000?) Nie jest potrzebny.

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

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.

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

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

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

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)

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! :)

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.

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

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:

(Jako tekst :)

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

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

Wpisz ścieżkę do katalogu hosta lokalnego

Wystąpił ten sam błąd:

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.

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.

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

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.

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

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

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

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

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

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

http://www.example.com/ * zadziałał dla mnie po wielu dniach prób.

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

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.

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

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

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

Z mojego doświadczenia

http://www.example.com

działało dobrze, ale na końcu wymagany jest https / *

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.

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

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>