Dépannage

Clé API et erreurs de facturation

Dans certains cas, une carte plus sombre ou une image "négative" Street View, portant le filigrane "à des fins de développement uniquement", peut s'afficher. Cela indique généralement des problèmes liés à une clé API ou à la facturation. Pour utiliser les produits Google Maps Platform, vous devez activer la facturation dans votre compte, et toutes les requêtes doivent inclure une clé API valide. La procédure suivante permet de résoudre ce problème :

Une clé API est transmise en tant que paramètre key dans l'URL utilisée pour charger l'API Maps JavaScript. Voici quelques options qui vous permettront de vérifier si vous utilisez une clé API :

  • Utilisez l'extension Chrome Google Maps Platform API Checker. Elle vous permet de déterminer si votre site Web met en œuvre correctement les API Google Maps sous licence de Google.
  • Si vous utilisez une bibliothèque ou un plug-in pour charger l'API Maps JavaScript, vérifiez les paramètres de cette bibliothèque et recherchez une option de clé API.
  • Vérifiez les erreurs dans votre navigateur. Si vous voyez les messages suivants, cela signifie que vous n'utilisez pas correctement votre clé API :

Pour les développeurs Web :

  • Si vous avez accès au code source de votre application, recherchez la balise <script> utilisée pour charger l'API Maps JavaScript. Lors du chargement de cette API, remplacez YOUR_API_KEY dans le code ci-dessous par votre clé API. 
      <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap">
  </script>
  • Vérifiez le trafic réseau généré par votre site Web dans le navigateur. Dans Chrome, vous pouvez afficher cette information dans l'onglet Réseau de DevTools. C'est aussi là que sont indiquées les requêtes réseau de votre site Web. Les requêtes effectuées à l'aide de l'API Maps JavaScript sont quant à elles incluses dans le chemin maps/api/js. Vous pouvez vérifier ici si les requêtes utilisent le paramètre key. Lorsque vous consultez l'onglet Réseau, il peut être utile de filtrer votre trafic réseau selon maps/api/js.

Pour obtenir une clé API, cliquez sur le bouton ci-dessous. Si la configuration étape par étape ne s'affiche pas, suivez les instructions complètes disponibles dans la section Premiers pas avec Google Maps Platform.
Commencer

Parfait ! Vérifions à présent qu'un compte de facturation est associé à votre projet.

Accédez à la page Facturation de la console Google Cloud, puis sélectionnez le projet dans lequel votre clé API a été créée. Pour confirmer que la clé est associée au projet, procédez comme suit :

  1. Accédez à la section Identifiants (depuis la barre latérale de gauche, sous Google Maps Platform > Identifiants).
  2. Vérifiez que la clé API que vous utilisez actuellement sur votre site Web est répertoriée. Si ce n'est pas le cas, sélectionnez un autre projet, puis vérifiez les identifiants.
  3. Si vous ne parvenez pas à trouver le projet correspondant à votre clé API, cela signifie que vous n'y avez peut-être plus accès. Demandez de l'aide aux autres membres de votre organisation. Si vous ne retrouvez pas le projet d'origine :
    1. Créez un projet. Pour ce faire, sélectionnez Nouveau projet dans la liste de projets, ou Créer un projet sur la page Resource Manager.
    2. Créez une clé API. Pour ce faire, accédez à la page Identifiants. Cliquez ensuite sur Créer des identifiants, puis sélectionnez Clé API.

Une fois que vous avez localisé votre projet dans la console Cloud, vérifiez si un compte de facturation lui est associé. Pour ce faire, accédez à la section Facturation dans le menu latéral de gauche.

Accédez à la page Activer la facturation dans la console Cloud et ajoutez un compte de facturation à votre projet. Pour en savoir plus, consultez la section Premiers pas avec Google Maps Platform.

Parfait ! Vérifions que le mode de facturation fourni est valide.

Vous pouvez ajouter, supprimer ou mettre à jour un mode de paiement dans la console Cloud.

Si vous avez vous-même défini une limite quotidienne pour l'une de vos API, ce qui est courant pour éviter toute augmentation inattendue, vous pouvez résoudre ce problème en augmentant votre limite quotidienne.

Vous pouvez vérifier vos limites quotidiennes en accédant au tableau de bord des API et services dans la console Cloud. Ensuite :

  1. Sélectionnez un projet si vous y êtes invité.
  2. Sélectionnez une API dans la liste, puis cliquez sur l'onglet Quotas.

Les clés API comportant une restriction d'adresse IP ne peuvent être utilisées qu'avec les services Web destinés à être utilisés côté serveur (l'API Geocoding et d'autres API Web Service, par exemple). La plupart de ces services Web disposent d'équivalents dans l'API Maps JavaScript (voir le service Geocoding, par exemple). Pour utiliser les services côté client de l'API Maps JavaScript, vous devez créer une clé API distincte qui peut être sécurisée à l'aide d'une restriction de référent HTTP (voir la section Obtenir, ajouter et restreindre une clé API).

Si votre code ne fonctionne pas :

Pour vous aider à configurer votre code Maps, Brendan Kenny et Mano Marks vous présentent dans cette vidéo quelques-unes des erreurs les plus courantes et la façon de les corriger.

  • Vérifiez qu'il ne contient pas de fautes de frappe. Rappelez-vous que le langage JavaScript est sensible à la casse.
  • Vérifiez les bases. Certains des problèmes les plus courants surviennent en effet lors de la création initiale de la carte. Par exemple :
    • Vérifiez que vous avez spécifié les propriétés zoom et center dans les options de votre carte.
    • Assurez-vous d'avoir déclaré un élément div dans lequel la carte s'affichera à l'écran.
    • Assurez-vous d'avoir défini une hauteur dans l'élément div pour la carte. Par défaut, les éléments div sont créés avec une hauteur de 0 et sont donc invisibles.
    Reportez-vous à nos exemples, qui vous proposent une implémentation de référence.
  • Utilisez un débogueur JavaScript pour identifier les problèmes, par exemple celui disponible dans les outils pour les développeurs Chrome. Commencez par rechercher d'éventuelles erreurs dans la console JavaScript.
  • Posez vos questions sur Stack Overflow. Pour savoir comment poser des questions de qualité, consultez la page d'assistance.