Esta pregunta se puede solucionar de variadas formas, pero nosotros te compartimos la que para nosotros es la solución más completa.
Solución:
- Vaya a esta dirección: https://console.developers.google.com/apis
- Crear nuevo proyecto y Crear Credenciales (API key)
- Haga clic en “Biblioteca”
- Haga clic en cualquier API que desee
- Haga clic en “Habilitar”
- Haga clic en “Credenciales” > “Editar clave”
- En “Restricciones de la aplicación”, seleccione “Referencias HTTP (sitios web)”
- En “Restricciones del sitio web”, haga clic en “AÑADIR UN ARTÍCULO”
- Escriba la dirección de su sitio web (o “localhost”, “127.0.0.1”, “localhost:puerto”, etc. para pruebas locales) en el campo de texto y presione INGRESAR para agregarlo a la lista
- AHORRE y use su key en tu proyecto
Puedes seguir de esta manera. Funciona al menos para mí:
en la página de credenciales:
-
Seleccione la opción con dirección IP (opción nº 3).
-
Pon tu dirección IP de tu proveedor. Si no lo hace, busque su dirección IP utilizando este enlace: https://www.google.com/search?q=my+ip
-
Guárdalo.
-
Cambie el enlace de su mapa de Google de la siguiente manera entre la etiqueta scrip:
https://maps.googleapis.com/maps/api/js?libraries=places&key=AIzxxxxxxxxx”
-
Espere unos 5 minutos o más para permitir que su API key propagar.
Ahora tu mapa de Google debería funcionar.
Si está trabajando en localhost, cree una clave API separada para su desarrollo y luego elimine las restricciones en eso key para que su host local pueda usarlo. Recuerda no usar este key en producción, para que no exponga su key a los cazadores en línea.
Tuve el mismo problema y todos los intentos de hacer que las restricciones funcionaran en mi entorno localhost no tuvieron éxito hasta que creé una apikey separada específicamente para el desarrollo y luego eliminé sus restricciones. Sin embargo, no uso eso. key en el entorno de producción, y una vez que termine con los desarrollos, eliminaré la API key inmediatamente.
Sé que esta publicación llega tarde, pero para las personas que probablemente enfrentarán este problema en el futuro, esta es la mejor ruta a seguir.
Comentarios y calificaciones
Si te ha sido de ayuda este post, sería de mucha ayuda si lo compartieras con otros juniors de esta forma nos ayudas a difundir esta información.