Klucz API Googlemaps dla lokalnego hosta


91

Jak uzyskać klucz API Googlemaps, aby działał na hoście lokalnym?

Utworzyłem klucz API i pod referencjami dodaję:

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

To nie działa i jeśli wykluczę klucz API, to też nie działa?


Odpowiedzi:


130
  1. Przejdź pod ten adres: https://console.developers.google.com/apis
  2. Utwórz klucz API dla swojego projektu
  3. Kliknij „Biblioteka”
  4. Kliknij dowolny interfejs API, który chcesz
  5. Kliknij „Włącz” (w prawym górnym rogu)
  6. Kliknij „Dane logowania”> „Edytuj klucz”
  7. W sekcji „Ograniczenie klucza” wybierz „Odsyłacze HTTP (witryny internetowe)”
  8. Wpisz adres swojej strony internetowej (lub „localhost”, „127.0.0.1”, „localhost: port” itp. W przypadku testów lokalnych) w polu tekstowym i naciśnij, ENTERaby dodać ją do listy
  9. Użyj swojego klucza w swoim projekcie

8
To samo zrobiłem, ale zastanawiam się: czy to oznacza, że ​​KAŻDY pracujący lokalnie (localhost / 127.0.0.1) może użyć mojego KLUCZA API (i prawdopodobnie wyliczyć dla mnie koszty po wprowadzeniu nowej ceny 2018-06-11) ?)
tmanolatos

31
@tmanolatos Tak, właśnie to oznacza. Nadawanie kluczowi produkcyjnemu praw do hosta lokalnego nie jest dobrą praktyką, ponieważ każdy może używać tego klucza podczas pracy lokalnej. Zamiast tego powinieneś zachować dwa klucze. Jeden do produkcji, który może być widoczny dla każdego i dlatego powinien być dozwolony tylko w Twojej domenie. Jeden do programowania, który powinien być traktowany jako poświadczenia (nie udostępniaj go) i umożliwia dostęp z lokalnego hosta.
the_cheff

2
@tmanolatos Tak, ale musisz zbudować dwa klucze, jeden do testowania aplikacji, a drugi do aplikacji głównej,
mirzaei.sajad

Otrzymuję tę odpowiedź po wykonaniu powyższych czynności: {"error_message": "Klucze API z ograniczeniami odwołującymi nie mogą być używane z tym API.", "Results": [], "status": "REQUEST_DENIED"} Oto adres URL , gdzie DEV_KEY jest zastępowane moim kluczem api: maps.googleapis.com/maps/api/geocode/ ...
rmutalik

Zwraca poprawny kod JSON, gdy używam mojego klucza PROD_KEY API.
rmutalik

10

Możesz podążać tą drogą. Działa przynajmniej na mnie:

na stronie danych logowania:

  1. Wybierz opcję z adresem IP (opcja nr 3).

  2. Umieść swój adres IP od dostawcy. Jeśli tego nie zrobisz, wyszukaj swój adres IP za pomocą tego linku: https://www.google.com/search?q=my+ip

  3. Zapisz to.

  4. Zmień link do mapy google w następujący sposób między tagiem script:

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

  5. Poczekaj około 5 minut lub dłużej, aby umożliwić propagację klucza API.

Teraz twoja mapa google powinna działać.


9

Jeśli pracujesz na hoście lokalnym, utwórz oddzielny klucz API do swojego rozwoju, a następnie usuń ograniczenia tego klucza, aby Twój host lokalny mógł go używać. Pamiętaj, aby nie używać tego klucza na produkcji, więc nie ujawniasz swojego klucza łowcom online.

Miałem ten sam problem i wszystkie próby uzyskania ograniczeń działających na moim środowisku hosta lokalnego nie powiodły się, dopóki nie utworzyłem oddzielnego pliku apikey specjalnie do programowania, a następnie usunąłem jego ograniczenia. Jednak nie używam tego klucza w środowisku produkcyjnym, a gdy skończę z rozwojem, natychmiast usunę klucz API.

Wiem, że ten post jest spóźniony, ale dla osób, które prawdopodobnie zmierzą się z tym problemem w przyszłości, jest to najlepsza droga.


5

Chyba trochę się spóźniłem na imprezę i chociaż zgadzam się, że stworzenie osobnego klucza do programowania (localhost) i produktu jest możliwe do zrobienia obu tylko jednym kluczem.

Kiedy używasz Ograniczenia aplikacji -> strony odsyłające http -> Ograniczenia witryny, możesz wprowadzić adresy URL zawierające symbole wieloznaczne.

Jednak używając symbolu wieloznacznego, takiego jak .localhost / lub .localhost: {port}. (kiedy już masz .yourwebsite.com / * ) nie działa.

Samo umieszczenie pojedynczego * działa, ale w zasadzie daje to nieograniczony klucz, który również nie jest tym, czego chcesz.

Kiedy dołączasz pełną ścieżkę bez użycia symbolu wieloznacznego *, to również działa, więc w moim przypadku wstawienie:

http: // localhost {port} /
http: // localhost : {port} / cos-else / tutaj

Sprawia, że ​​mapy Google działają zarówno lokalnie, jak na www.twojawitryna.com przy użyciu tego samego klucza API.

W każdym razie, gdy posiadanie 2 oddzielnych kluczy jest również opcją, radziłbym to zrobić.


1

Możesz skorzystać z tego samouczka, jak używać Map Google do testowania na hoście lokalnym.

Sprawdź te powiązane wątki SO:

Mam nadzieję że to pomoże!


2
uszkodzony link jest uszkodzony
Rafael Herscovici


@AEGrey - nie dla mnie, dla przyszłych użytkowników.
Rafael Herscovici

1

Musisz sprawdzić konkretny błąd w konsoli javascript (np. Ctrl+ Shift+ KW Firefox dla Windows).

Według Stevena Gliebe (2016) istnieją cztery typowe przypadki tego problemu. Jeśli mogę podsumować to tak:

  1. MissingKeyMapError >> Uzyskaj klucz API Map Google (ale rozważ również alternatywę nr 2)
  2. RefererNotAllowedMapError >> Zarejestruj swój localhost: port w panelu programisty Google .
  3. ApiNotActivatedMapError >> Włączanie Google Maps API na stronie Google API Library
  4. InvalidKeyMapError >> Dodaj poprawnie klucz do skryptów / kodów

Po wykonaniu pewnych modyfikacji kodu wyczyść pamięć podręczną przeglądarki, jeśli to konieczne.

W przypadku wystąpienia innych błędów możesz sprawdzić stronę z dokumentacją kodów błędów interfejsu API Map Google .


0

Tam, gdzie jest napisane „Akceptuj żądania od tych stron odsyłających HTTP (witryn) (opcjonalnie)”, nie musisz podawać żadnej strony odsyłającej. Więc kliknij X obok localhost na tej stronie, ale nadal używaj swojego klucza.

Powinien wtedy zadziałać po kilku minutach.

Wprowadzone zmiany mogą czasami potrwać kilka minut, dlatego poczekaj kilka minut przed ponownym przetestowaniem.


0

Wpisując „moje IP” w wyszukiwarce Google, otrzymałem swój publiczny adres IP i wkleiłem go w adres IP (trzecia opcja). Mi to pasuje.


0

Wpisując „moje IP” w wyszukiwarce Google, otrzymałem swój publiczny adres IP i wkleiłem go w adres IP (trzecia opcja). Mi to pasuje.

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.