En este documento, se proporcionan recomendaciones para configurar la Política de Seguridad del Contenido (CSP) del sitio web para la API de Maps JavaScript. Dado que los usuarios finales usan una gran variedad de tipos y versiones de navegadores, se recomienda a los desarrolladores que usen este ejemplo como referencia y que realicen ajustes hasta que no se produzcan más incumplimientos de la CSP.
Obtén más información sobre la Política de Seguridad del Contenido.
CSP estricta
Recomendamos usar una CSP estricta en lugar de una CSP de lista de entidades permitidas para mitigar la posibilidad de ataques de seguridad.
La API de Maps JavaScript admite el uso de una CSP estricta basada en nonce.
Los sitios web deben propagar los elementos script y style con un valor nonce.
De forma interna, la API de Maps JavaScript encontrará el primer elemento y aplicará su valor nonce a los elementos de diseño o de secuencia de comandos insertados por la secuencia de comandos de la API, respectivamente.
Ejemplo
A continuación, se muestra una CSP de ejemplo, junto con una página HTML en la que está incorporada:
Ejemplo de Política de Seguridad del Contenido
script-src 'nonce-{script value}' 'strict-dynamic' https: 'unsafe-eval' blob:;
img-src 'self' https://*.googleapis.com https://*.gstatic.com *.google.com *.googleusercontent.com data:;
frame-src *.google.com;
connect-src 'self' https://*.googleapis.com *.google.com https://*.gstatic.com data: blob:;
font-src https://fonts.gstatic.com;
style-src 'nonce-{style value}' https://fonts.googleapis.com;
worker-src blob:;
Ejemplo de página HTML
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" nonce="{style value}">
<style nonce="{style value}">...</style>
...
</head>
<body>
<div id="map"></div>
<script src="https://maps.googleapis.com/maps/api/js?key=&callback=initMap" async nonce="{script value}"></script>
<script nonce="{script value}"> function initMap() { ... } </script>
</body>
</html>
CSP de lista de entidades permitidas
Si configuraste una CSP de lista de entidades permitidas, consulta la lista de dominios de Google Maps. Te recomendamos que consultes este documento y las notas de la versión de la API de Maps JavaScript para mantenerte al tanto y, en caso de ser necesario, incluir los dominios de servicio nuevos en la lista de entidades permitidas.
Los sitios web que cargan la API de Maps JavaScript desde un dominio heredado de las APIs de Google (por ejemplo, maps.google.com) o un dominio de una región específica (por ejemplo, maps.google.fr) también deben incluir estos nombres de dominio en la configuración script-src de la CSP, como se muestra en el siguiente ejemplo:
script-src 'self' 'unsafe-inline' 'unsafe-eval' https://*.googleapis.com https://*.gstatic.com *.google.com https://*.ggpht.com *.googleusercontent.com blob:;
img-src 'self' https://*.googleapis.com https://*.gstatic.com *.google.com *.googleusercontent.com data:;
frame-src *.google.com;
connect-src 'self' https://*.googleapis.com *.google.com https://*.gstatic.com data: blob:;
font-src https://fonts.gstatic.com;
style-src 'self' 'unsafe-inline' https://fonts.googleapis.com;
worker-src blob:;