Las aplicaciones basadas en Google Maps Platform utilizan claves de API como una medida de seguridad para garantizar que solo los usuarios autorizados accedan y utilicen los servicios de Google Maps.
En este artículo, te guiaremos a través del proceso de creación, restricción y uso de tu clave de API en Google Maps Platform.
Tabla de contenidos
Antes de comenzar.
Antes de poder utilizar la API de Maps JavaScript, asegúrate de tener un proyecto creado en la consola de Cloud de Google con una cuenta de facturación asociada y la API de Maps JavaScript habilitada. Puedes obtener más información sobre la configuración en la consola de Cloud en el artículo correspondiente.
Crea una clave de API.
La clave de API es un identificador único que autentica las solicitudes asociadas a tu proyecto con fines de uso y facturación. Aquí te dejamos los pasos para crear una clave de API:
I. Consola de Cloud.
- Ve a la página de Google Maps Platform > Credenciales en la Consola de Cloud.
- En la página de Credenciales, haz clic en «Crear credenciales» y elige «Clave de API».
- Se mostrará un diálogo con la nueva clave de API. Haz clic en «Cerrar».
- La nueva clave de API ahora aparecerá en la página de Credenciales debajo de «Claves de API». Asegúrate de restringirla antes de usarla en producción.
II. SDK de Cloud.
Si prefieres utilizar el SDK de Cloud, puedes crear una clave de API con el siguiente comando:
gcloud alpha services api-keys create \ --project "TU_PROYECTO" \ --display-name "NOMBRE_DE_LA_CLAVE"
Asegúrate de obtener más información sobre el SDK de Google Cloud, su instalación y otros comandos disponibles.
Restringe una clave de API.
Google recomienda restringir las claves de API para limitar su uso solo a las APIs necesarias para tu aplicación. Esto agrega una capa adicional de seguridad protegiendo tu aplicación de solicitudes no autorizadas. Puedes seguir las mejores prácticas de seguridad de API para obtener más detalles.
Es importante tener en cuenta que cuando restringes una clave de API en la consola de Cloud, las restricciones de aplicaciones anularán todas las APIs habilitadas. Por lo tanto, se sugiere crear una clave de API independiente para cada aplicación y plataforma.
Agrega la clave de API a tu solicitud.
Para utilizar la API de Maps JavaScript, es necesario incluir la clave de API en cada solicitud. A continuación, te proporcionamos un ejemplo de cómo hacerlo:
<script>
(function (g) {
var h, a, k, p = "The Google Maps JavaScript API", c = "google", l = "importLibrary", q = "__ib__", m = document, b = window;
b = b[c] || (b[c] = {});
var d = b.maps || (b.maps = {}), r = new Set, e = new URLSearchParams, u = () => h || (h = new Promise(async (f, n) => {
await (a = m.createElement("script"));
e.set("libraries", [...r] + "");
for (k in g) e.set(k.replace(/[A-Z]/g, t => "_" + t[0].toLowerCase()), g[k]);
e.set("callback", c + ".maps." + q);
a.src = `https://maps.${c}apis.com/maps/api/js?` + e;
d[q] = f;
a.onerror = () => h = n(Error(p + " could not load."));
a.nonce = m.querySelector("script[nonce]")?.nonce || "";
m.head.append(a);
}));
d[l] ? console.warn(p + " only loads once. Ignoring:", g) : d[l] = (f, ...n) => r.add(f) && u().then(() => d[l](f, ...n))
})({
key: "TU_CLAVE_API_AQUÍ",
// Agrega otros parámetros según sea necesario, utilizando el formato camel case.
// Utiliza el parámetro 'v' para indicar la versión a cargar (alpha, beta, semanal, etc.).
});
</script>
Asegúrate de reemplazar «TU_CLAVE_API_AQUÍ» con la clave de API que has creado. Con estos pasos, habrás creado, restringido y utilizado con seguridad tu clave de API de Google Maps. ¡Listo para integrar mapas interactivos en tu aplicación!