Guide de la stratégie de sécurité du contenu

Restez organisé à l'aide des collections Enregistrez et classez les contenus selon vos préférences.

Ce document fournit des recommandations sur la configuration de Content Policy (CSP) de site Web pour l'API Maps JavaScript. Étant donné qu'une grande variété de types et de versions de navigateur sont utilisés par les utilisateurs finaux, les développeurs sont invités à se servir de cet exemple comme référence, en procédant à un réglage jusqu'à ce qu'aucun autre cas de non-respect des CSP ne se produise.

En savoir plus sur Content Policy

CSP strict

Nous vous recommandons d'utiliser un CSP strict plutôt qu'un CSP de liste d'autorisation pour réduire le risque d'attaques de sécurité. L'API Maps JavaScript est compatible avec l'utilisation d'un fournisseur de services de configuration strict (CSP) non basé sur "cece". Les sites Web doivent renseigner les éléments script et style avec une valeur nonce. En interne, l'API Maps JavaScript trouve le premier élément de ce type et applique sa valeur "nonce" aux éléments de style ou de script insérés par le script de l'API, respectivement.

Exemple

L'exemple suivant présente un exemple de CSP, ainsi qu'une page HTML dans laquelle il est intégré:

Exemple de stratégie de sécurité du contenu

script-src 'nonce-{script value}' 'strict-dynamic' https: 'unsafe-eval';
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

Exemple de page 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>

Ajouter une CSP à la liste d'autorisation

Si vous avez configuré une CSP de liste d'autorisation, veuillez consulter la liste des domaines Google Maps. Nous vous recommandons de consulter ce document et les notes de version de l'API Maps JavaScript pour être à jour et inclure tout nouveau domaine de service dans la liste d'autorisation si nécessaire.

Les sites Web qui chargent l'API Maps JavaScript à partir d'un ancien domaine d'API Google (par exemple, maps.google.com) ou d'un domaine spécifique à la région (par exemple, maps.google.fr) doivent également inclure ces noms de domaine dans leur paramètre script-src de CSP, comme illustré dans l'exemple suivant:

script-src 'self' 'unsafe-inline' 'unsafe-eval' https://*.googleapis.com https://*.gstatic.com *.google.com https://*.ggpht.com *.googleusercontent.com;
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