Mapa jeszcze jest. Widać ulice, nazwy miejsc, czasem nawet znacznik firmy. Tyle że wszystko zostało przyciemnione, a na środku pojawił się komunikat "Ta strona nie może poprawnie wczytać Map Google". Niekiedy dochodzi do tego napis "For development purposes only". Co się stało? Najczęściej sama mapa jest w porządku. Problem leży gdzie indziej - w kluczu API, jego ograniczeniach, rozliczeniach albo konfiguracji Google Maps Platform. I właśnie dlatego usuwanie mapy i wstawianie jej od nowa zwykle niczego nie daje.
- Dlaczego mapa Google nagle przestała działać?
- Najczęstsze błędy Map Google i ich rozwiązania
- Zanim cokolwiek zmienisz - sprawdź konsolę
- Mam klucz API. Dlaczego mapa nadal nie działa?
- Mapa przestała działać po zmianie domeny
- Czy Google Maps API jest płatne?
- Może API w ogóle nie jest potrzebne?
- W jakiej kolejności szukać problemu?
Dlaczego mapa Google nagle przestała działać?
Wczoraj działała, dzisiaj nie. Pierwsze podejrzenie? WordPress. Wtyczka. Aktualizacja szablonu. Ktoś przecież musiał coś zepsuć.
Niekoniecznie.
Jeśli mapa została przyciemniona i wyświetla komunikat "Ta strona nie może poprawnie wczytać Map Google", znacznie bardziej interesuje nas sposób, w jaki witryna łączy się z Google Maps Platform. Klucz API może być nieprawidłowy. Może być prawidłowy, ale nie mieć dostępu do potrzebnej usługi. Projekt może też nie mieć poprawnie skonfigurowanych rozliczeń.
Czasami przyczyna jest wręcz banalna.
Strona powstawała pod adresem testowym, mapa działała, wszystko było dobrze. Potem witryna trafiła pod właściwą domenę i właśnie wtedy przestała działać. Klucz API nadal dopuszcza domenę testową, a nowej już nie.
Z zewnątrz wszystkie te przypadki mogą wyglądać niemal identycznie. Dlatego wygląd mapy jest tylko wskazówką. Potrzebujemy konkretnego błędu.
Najczęstsze błędy Map Google i ich rozwiązania
Google nie ogranicza się do wyświetlenia ogólnego komunikatu na mapie. W tle podaje znacznie dokładniejszą informację. Trzeba tylko do niej dotrzeć.
Poniżej kilka błędów, które rzeczywiście warto znać.
| Objaw lub błąd | Co prawdopodobnie się stało? | Gdzie szukać? |
|---|---|---|
MissingKeyMapError |
Strona próbuje załadować mapę bez wymaganego klucza API. | Ustawienia wtyczki, motywu albo kod odpowiedzialny za mapę. |
InvalidKeyMapError |
Przekazywany klucz jest nieprawidłowy. | Sprawdź, czy strona używa właściwego klucza z odpowiedniego projektu. |
BillingNotEnabledMapError |
Projekt nie ma wymaganej konfiguracji rozliczeń. | Konto rozliczeniowe projektu i metodę płatności. |
RefererNotAllowedMapError |
Domena, z której wysyłane jest żądanie, nie może używać tego klucza. | Ograniczenia witryn HTTP przypisane do klucza. |
ApiNotActivatedMapError |
Potrzebne API nie jest aktywne w projekcie. | Listę włączonych usług Google Cloud. |
ApiTargetBlockedMapError |
Klucz istnieje, ale jego ograniczenia blokują potrzebne API. | Ograniczenia API ustawione dla klucza. |
OverQuotaMapError |
Został przekroczony dostępny limit. | Wykorzystanie API oraz ustawione limity. |
| Mapa działała przed zmianą domeny | Nowy adres nie został uwzględniony w ograniczeniach klucza. | Dozwolone domeny, subdomeny oraz warianty adresu. |
| Napis "For development purposes only" | Problem może dotyczyć autoryzacji, klucza API lub rozliczeń. | Najpierw konsola przeglądarki, później konfiguracja projektu. |
Nie próbowałbym jednak naprawiać mapy wyłącznie na podstawie tej tabeli. Dwie strony mogą wyglądać tak samo, a zgłaszać zupełnie inne błędy.
Najpierw diagnoza.
Zanim cokolwiek zmienisz - sprawdź konsolę
To kilka sekund, a potrafi oszczędzić pół godziny przypadkowego klikania.
Otwórz stronę z mapą w Chrome. Naciśnij F12, przejdź do zakładki Console i odśwież stronę.
Jeżeli problem dotyczy Maps JavaScript API, można tam zobaczyć komunikat podobny do:
Google Maps JavaScript API error: RefererNotAllowedMapErrorI to już jest konkret.
Nie trzeba teraz instalować innej wtyczki, tworzyć nowej mapy ani grzebać w CSS. Google mówi wprost, że problem dotyczy adresu, z którego używany jest klucz.
Przy MissingKeyMapError szukamy zupełnie gdzie indziej. Strona nie przekazuje wymaganego klucza. Z kolei BillingNotEnabledMapError kieruje nas do rozliczeń projektu.
Najpierw kod błędu. Potem naprawa. Ta kolejność naprawdę ma znaczenie.
Mam klucz API. Dlaczego mapa nadal nie działa?
"Przecież klucz jest wpisany". To jedna z tych informacji, które brzmią uspokajająco, dopóki nie sprawdzimy, jaki klucz rzeczywiście wysyła strona.
W WordPressie potrafi być ciekawie. Klucz zapisano kiedyś w ustawieniach motywu. Później ktoś dołożył wtyczkę do map i wpisał tam drugi. Po migracji pojawił się trzeci. Administrator zmienia jeden z nich i dziwi się, że nic się nie dzieje.
Bo strona korzysta z innego.
Do tego dochodzą ograniczenia. Poprawny klucz może nie mieć dostępu do Maps JavaScript API albo może być skonfigurowany tylko dla określonych witryn.
Dlatego zamiast sprawdzać wyłącznie pole w panelu CMS, dobrze zobaczyć, co faktycznie wychodzi z przeglądarki. W żądaniu do Maps JavaScript API pojawia się parametr key. To właśnie ten klucz interesuje nas najbardziej.
Klucz widoczny w ustawieniach strony nie musi być kluczem faktycznie używanym przez mapę. Przy starszych witrynach, kilku wtyczkach i kolejnych migracjach zdarza się to częściej, niż można przypuszczać.
Mapa przestała działać po zmianie domeny
To jeden z pierwszych tropów, które sprawdziłbym po migracji.
Załóżmy, że przez kilka tygodni strona powstawała pod adresem:
test.example.pl
Klucz API został ograniczony właśnie do tej domeny. Przychodzi dzień uruchomienia serwisu, witryna trafia na:
example.pl
Strona działa. Zdjęcia są. Formularz jest. Mapa - nie.
Google widzi teraz żądanie z innego adresu niż ten, który został dopuszczony w konfiguracji klucza. Podobnie może być po zmianie z wersji www na adres bez www, po przeniesieniu mapy do subdomeny czy po całkowitej zmianie domeny.
Rozwiązaniem nie jest wyłączenie wszystkich zabezpieczeń klucza. Lepiej poprawić ograniczenia tak, aby odpowiadały rzeczywistym adresom, z których korzysta witryna.
I sprawdzić mapę tam, gdzie naprawdę się znajduje. Niekoniecznie na stronie głównej. Częściej będzie to "Kontakt", strona konkretnego oddziału albo kilka podstron lokalnych.
Czy Google Maps API jest płatne?
To pytanie zwykle pojawia się w dość konkretnym momencie: mapa nie działa, ktoś wchodzi do Google Cloud i nagle widzi ustawienia rozliczeń.
Usługi Google Maps Platform korzystające z API mają własny model rozliczeń. Projekt wymagający rozliczeń musi być prawidłowo powiązany z kontem billingowym. Samo dodanie metody płatności nie oznacza jednak, że za niewielką mapę na stronie kontaktowej natychmiast pojawi się duży rachunek. Znaczenie ma rodzaj używanej usługi oraz faktyczne wykorzystanie.
Nie zostawiałbym tego jednak bez kontroli.
W Google Cloud można śledzić wykorzystanie usług i ustawiać odpowiednie limity. Sam klucz również powinien być ograniczony do tych witryn i API, które naprawdę go potrzebują.
Jeśli mapa działała od dawna i nagle przestała, sprawdź również rzeczy prozaiczne. Metoda płatności mogła stracić ważność. Mógł zostać osiągnięty ustawiony limit. Ktoś mógł też zmienić konfigurację projektu.
Nie każda awaria zaczyna się w kodzie strony.
Może API w ogóle nie jest potrzebne?
To pytanie warto zadać, zanim zaczniemy budować rozbudowaną integrację tylko po to, żeby pokazać adres biura.
Jeśli na stronie "Kontakt" potrzebujemy zwykłej mapy z lokalizacją firmy, często wystarczy jej prostsze osadzenie. Bez własnego skryptu, bez niestandardowych markerów i bez dodatkowej logiki.
Ale nie zawsze.
Mapa może być wyszukiwarką punktów sprzedaży. Może pobierać lokalizacje z bazy, mieć własne znaczniki, reagować na działania użytkownika albo korzystać z geokodowania. Wtedy zwykłe osadzenie nie zastąpi pełnej integracji.
Dlatego zamiast zaczynać od pytania "jakie API podłączyć?", lepiej zapytać:
Co ta mapa ma właściwie robić?
Jeżeli tylko pokazać, gdzie znajduje się firma, prostsze rozwiązanie może być zupełnie wystarczające.
W jakiej kolejności szukać problemu?
Nie generuj od razu nowego klucza. Nie instaluj kolejnej wtyczki. I nie usuwaj działającej dotąd mapy.
Najpierw F12 i konsola.
Masz kod błędu? Dopiero teraz wiadomo, gdzie patrzeć. Sprawdź klucz rzeczywiście wysyłany przez stronę, aktywne API, ograniczenia domen, konfigurację rozliczeń i limity.
A jeśli awaria pojawiła się dokładnie po jakiejś zmianie, nie ignoruj tego tropu. Po migracji sprawdź domenę i klucz. Po zmianie wtyczki ustal, kto teraz ładuje mapę. Po przeniesieniu strony zobacz, czy nie została stara konfiguracja.
Komunikat "Ta strona nie może poprawnie wczytać Map Google" jest ogólny. Nie mówi jeszcze, co naprawić.
Konsola zwykle mówi znacznie więcej.
Źródła:
Komentarze