Google Maps JavaScript API RefererNotAllowedMapError

Nous essayons de développer une application de géolocalisation pour l'un de nos clients, et nous voulons d'abord la tester dans notre propre domaine.

Nous avons signé pour l'API JavaScript de Google Maps, et nous avons une clé de navigateur valide et notre domaine, www.grupocamaleon.com, a été autorisé à utiliser cette clé.

Mais nous ne pouvons même pas exécuter l'exemple le plus simple sans erreur.

Nous avons, dans notre domaine et avec notre clé, la démo suivante:

(1) http://www.grupocamaleon.com/boceto/aerial-simple.html

Mais cela ne fonctionne pas, et la console Firebug dit:

"Erreur de l'API Google Maps: Erreur de l'API Google Maps: RefererNotAllowedMapError (lien vers la documentation Google sur RefererNotAllowedMapError) URL de votre site à autoriser: (1)"

Ma page d'informations d'identification n'a pas la possibilité d'ajouter des référents à accepter, donc les solutions impliquant l'ajout de référents ne sont pas possibles pour le moment.

Ma page d'identification:

Pourquoi avons-nous cette erreur? Comment pouvons-nous y remédier?

Je sais que c'est une vieille question qui a déjà plusieurs réponses, mais j'ai eu ce même problème et pour moi le problème était que j'ai suivi l'exemple fourni sur console.developers.google.com et entré mes domaines dans le format *.domain.tld/*. Cela ne fonctionne pas du tout, et j'ai essayé d' ajouter toutes sortes de variations à cela comme domain.tld, domain.tld/*, *.domain.tldetc.

Ce qui a résolu le problème pour moi, c'est aussi l'ajout du protocole réel ; http://domain.tld/*est le seul dont j'ai besoin pour qu'il fonctionne sur mon site. Je suppose que je devrai ajouter https://domain.tld/*si je devais passer à HTTPS.

Mise à jour: Google a enfin mis à jour l'espace réservé pour inclure httpmaintenant:

Allez sur Google, vous êtes plus intelligents que ne le laisse la page d'identification de l'API. (Je sais parce que j'ai deux fils qui travaillent là-bas.)

La liste des "référents" est beaucoup plus difficile qu'elle ne le laisse supposer. (Bien sûr, cela devrait être plus indulgent.) Voici quelques règles qui m'ont pris des heures à découvrir:

• L'ordre dans la liste est important. Déplacer votre URL dans la liste peut le faire fonctionner.
• Le préfixe "http: //" est requis.
• Même "localhost" en a besoin: " http: //localhost/foo/bar.html "
• Un traînant * tant que caractère générique semble fonctionner comme s'il s'agissait d'une comparaison de chaînes.
• Même avec " http: //localhost/foo/bar.html ", " http: //localhost/foo/bar.html? Arg = 1 " ne fonctionnera pas. (Un joker aidera-t-il?)
• Pour les deux prod dev, ayez (au moins) deux lignes: " http: //localhost/foo/bar.html " et " http://my.site.com/foo/bar.html "
• Un numéro de port (8085? 4000?) Ne semble pas nécessaire.

Il existe probablement d'autres règles, mais c'est un jeu de devinettes fastidieux.

Selon la documentation, 'RefererNotAllowedMapError' signifie

L'URL actuelle chargeant l'API JavaScript de Google Maps n'a pas été ajoutée à la liste des référents autorisés. Veuillez vérifier les paramètres de provenance de votre clé API dans la Google Developers Console.

J'ai configuré l'API Google Maps Embed pour ma propre utilisation personnelle / professionnelle et jusqu'à présent, je n'ai spécifié aucun référent HTTP. Je n'enregistre aucune erreur. Vos paramètres doivent faire en sorte que Google pense que l'URL que vous visitez n'est ni enregistrée ni autorisée.

Rappelez-vous simplement que si vous le modifiez, cela peut prendre jusqu'à 5 minutes pour que les paramètres prennent effet.

J'ai essayé de nombreuses variantes de référents et j'ai également attendu 5 minutes jusqu'à ce que je réalise que l'exemple que Google remplit dans le champ de formulaire est défectueux. Ils montrent:

*.example.com/*

Cependant, cela ne fonctionne que si vous avez subdomain.ou www.devant votre nom de domaine. Ce qui suit a fonctionné pour moi immédiatement (en omettant la période principale de l'exemple de Google):

*example.com/*

Selon les documents de Google cela est arrivé parce que le urlsur lequel vous utilisez l'API Google Maps, il not registeredenlist of allowed referrers

ÉDITER :

Depuis Google Docs

Tous les sous-domaines d'un domaine spécifié sont également autorisés.

Si http://example.com est autorisé, alors http://www.example.com est également autorisé. L'inverse n'est pas vrai: si http://www.example.com est autorisé, http://example.com n'est pas forcément autorisé

Alors, veuillez configurer le http://testdomain.comdomaine, puis vous http://www.testdomain.comcommencerez à travailler.

Vérifiez que le bon APIS est également activé.

J'ai essayé tout ce qui précède, les astérisques, les noms de domaine, les barres obliques, les barres obliques inverses et tout, même à la fin en n'entrant qu'une seule URL comme dernier espoir.

Tout cela n'a pas fonctionné et j'ai finalement réalisé que Google exige également que vous spécifiiez maintenant les API que vous souhaitez utiliser (voir capture d'écran)

Je n'avais pas ceux dont j'avais besoin activés (pour moi, c'était l'API JavaScript de Maps)

Une fois que je l'ai activé, tout a bien fonctionné en utilisant:

http://www.example.com/ *

J'espère que cela aide quelqu'un! :)

Les caractères génériques (astérisques) NE SONT PAS autorisés dans la partie sous-domaine.

• FAUX: * .example.com / *
• DROITE: example.com/*

Oubliez ce que Google dit sur l'espace réservé, ce n'est pas autorisé.

J'ai trouvé que même les vôtres HTTP Referreressont suffisamment valables, mauvais ensemble de API Restrictionscauses Google Maps JavaScript API error: RefererNotAllowedMapError.

Par exemple:

• Vous utilisez l'API Javascript pour la clé.
• Ajouter http://localhost/*àApplication Restrictions / HTTP Referrences
• Choisissez Maps Embed APIau lieu deMaps Javascript API
• Ce qui provoque RefererNotAllowedMapError

Il y a beaucoup de solutions supposées sur plusieurs années, et certaines ne fonctionnent plus et d'autres ne l'ont jamais fait, donc ma prise à jour fonctionne fin juillet 2018.

Installer:

L'API JavaScript de Google Maps doit fonctionner correctement avec…

• plusieurs domaines appelant l'API: example.cometexample.net
• sous-domaines arbitraires: user22656.example.com etc.
• protocoles HTTP sécurisés et standards: http://www.example.com/ethttps://example.net/
• structure de chemin indéfinie (c'est-à-dire un grand nombre de chemins URL différents)

Solution:

• En fait, en utilisant le modèle de l'espace réservé: <https (or) http>://*.example.com/* .
• Ne pas omettre le protocole, mais ajouter deux entrées par domaine (une par protocole).
• Une entrée supplémentaire pour les sous-domaines (avec un *. premier nom d'hôte).
• J'avais le sentiment que l' RefererNotAllowedMapErrorerreur apparaissait toujours en utilisant la bonne configuration (et après avoir attendu amplement de temps). J'ai supprimé la clé d'identification, répété la demande (maintenantInvalidKeyMapError ), créé de nouvelles informations d'identification (en utilisant exactement la même configuration), et cela a fonctionné depuis.
• L'ajout de simples protocoles et domaines ne semblait pas avoir inclus de sous-domaines.
• Pour l'un des domaines, la configuration de travail ressemble à ceci:

(Sous forme de texte :)

Accept requests from these HTTP referrers (web sites)
    https://*.example.com/*
    https://example.com/*
    http://*.example.com/*
    http://example.com/*

Acceptez les demandes de ces référents HTTP (sites Web)

Ecrire le chemin du répertoire localhost

J'ai rencontré la même erreur:

Ce lien explique comment configurer les restrictions de clé API: https://cloud.google.com/docs/authentication/api-keys#adding_http_restrictions

Dans mon cas, le problème était que j'utilisais cette restriction:

Référents HTTP (sites Web) Acceptez les demandes de ces référents HTTP (sites Web) (facultatif) Utilisez des * pour les caractères génériques. Si vous laissez ce champ vide, les demandes de tout référent seront acceptées. Assurez-vous d'ajouter des référents avant d'utiliser cette clé en production. https://*.example.net/*

Cela signifie que des URL telles que https://www.example.net ou https://m.example.net ou https://www.example.net/San-salvador/ fonctionneraient. Cependant, des URL telles que https://example.net ou https://example.net ou https://example.net/San-salvador/ ne fonctionneraient pas. J'avais simplement besoin d'ajouter un deuxième référent:

https://example.net/*

Cela a résolu le problème pour moi.

J'ajoute 2 domaines de site Web, définir "*" dans le sous-domaine ne fonctionne pas mais le sous-domaine spécifique "WWW" et non-sous-domaine a été travaillé pour mes sites Web en utilisant la même clé API Google Map.

ne pas utiliser "*" dans le sous-domaine

J'espère que cela aidera.

vous affichez une capture d'écran de votre page d'informations d'identification api, mais vous devez cliquer sur "Clé du navigateur 1" et partir de là pour ajouter des référents.

Pour des pages imbriquées plus profondes

Si vous avez un projet dans un dossier par exemple ou des pages imbriquées

http://yourdomain.com/your-folder/your-page vous pouvez entrer ceci dans

http://yourdomain.com/*/*

L'important étant de /*/*/*savoir jusqu'où vous devez aller

Il semble que le *ne correspondra pas /ou n'entrera pas dans des chemins plus profonds.

Cela donnera à votre domaine un accès complet, sauf si vous avez une imbrication plus profonde que cela.

Aucun de ces correctifs ne fonctionnait pour moi jusqu'à ce que je découvre que cela RefererNotAllowedMapErrorpeut être causé par l'absence de compte de facturation lié au projet. Assurez-vous donc d'activer votre essai gratuit ou autre.

1. Que votre facturation est activée

2. Que votre site Web a été ajouté à Google Console

3. Que votre site Web soit ajouté aux référents de votre application.

4. (faites un joker pour www et aucun www)

http://www.example.com/ * et http://example.com/ *

5. Que Javascript Maps est activé et que vous utilisez les informations d'identification correctes

6. Le site Web a été ajouté à votre DNS pour activer votre console Google ci-dessus.

7. Souriez après que cela fonctionne!

Ceci est un autre produit Google sh1tty avec une implémentation terrible.

Le problème que j'ai trouvé avec ceci est que si vous limitez une clé API par adresse IP, cela ne fonctionnera pas ... MAIS loin de la part de Google de clarifier ce point ... Ce n'est qu'après le dépannage et la recherche que j'ai trouvé:

Les clés API avec une restriction d'adresses IP ne peuvent être utilisées qu'avec des services Web destinés à être utilisés du côté serveur (tels que l'API de géocodage et d'autres API de service Web). La plupart de ces services Web ont des services équivalents dans l'API JavaScript Maps (par exemple, consultez le service de géocodage). Pour utiliser les services côté client de l'API JavaScript Maps, vous devrez créer une clé API distincte qui peut être sécurisée avec une restriction de référents HTTP (voir Restreindre une clé API).

https://developers.google.com/maps/documentation/javascript/error-messages

FFS Google ... Information assez importante qu'il serait bon de clarifier sur la configuration ...

http://www.example.com/ * a fonctionné pour moi après des jours et des jours d'essais.

J'ai enfin fait fonctionner le mien en utilisant cette astuce de Google: ( https://support.google.com/webmasters/answer/35179 )

Voici nos définitions de domaine et de site. Ces définitions sont spécifiques à la vérification de la Search Console:

http://example.com/ - A site (because it includes the http:// prefix)
example.com/ - A domain (because it doesn't include a protocol prefix)
puppies.example.com/ - A subdomain of example.com
http://example.com/petstore/ - A subdirectory of http://example.com site

J'ai également eu du mal à faire fonctionner cela, mais voici quelques conseils:

• Les URL définies comme référents incluent http, par exemplehttp://example.com/*
• L'API JavaScript de Google Maps a été activée
• La facturation a été configurée sur ce compte

Une fois que tout cela a été résolu, les cartes s'affichent comme prévu.

J'essayais d'utiliser l' API Places (Autocomplete) et j'ai dû également activer l' API Maps Javascript à partir de Google Cloud Console avant que l'API Places ne fonctionne.

Vérifiez votre déclaration sur place. Pour charger l'API JavaScript de Google Maps, utilisez une balise de script comme celle-ci

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"
async defer></script>

J'utilise cette déclaration sur mon site Wordpress dans le fichier function.php

wp_enqueue_script("google-maps-v3", "//maps.google.com/maps/api/js?key=YOUR_API_KEY", false, array(), false, true);

J'ai défini la clé API sur ce format et cela fonctionne bien

http://my-domain-name(without www).com/*

cette déclaration ne fonctionne pas

*.my-domain-name.com/*

La suppression des restrictions (à Aucune) a fonctionné pour moi.

Dans mon expérience

http://www.example.com

a bien fonctionné mais, https requis / * à la fin

La console Javascript de Chrome m'a suggéré de déclarer l'adresse complète de la page dans ma liste de référents HTTP, dans ce cas http://mywebsite.com/map.htm Même si l'adresse exacte est http://www.mywebsite.com/map.htm - J'avais déjà des styles génériques répertoriés comme suggérés par d'autres, mais c'était la seule façon dont cela fonctionnerait pour moi.

Cela a fonctionné pour moi. Il existe 2 grandes catégories de restrictions dans les paramètres de clé API:

• Application restrictions
• API restrictions

Restrictions d'application:

En bas de la section Référent, ajoutez l'url de votre site Web " http://www.grupocamaleon.com/boceto/aerial-simple.html ". Il y a des exemples de règles sur le côté droit de la section en fonction de diverses exigences.

Restrictions de l'API:

Sous les restrictions de l'API, vous devez sélectionner explicitement `` API Maps Javascript '' dans la liste déroulante, car notre clé unique ne sera utilisée que pour appeler l'API Google Maps (probablement) et l'enregistrer comme vous pouvez le voir dans le cliché ci-dessous. J'espère que cela fonctionne pour vous ..... a fonctionné pour moi

Vérifiez votre script:

Le problème peut également survenir en raison d'une alimentation incorrecte des clés dans la balise de script. Cela devrait être quelque chose comme:

  <script async defer src="https://maps.googleapis.com/maps/api/jskey=YOUR_API_KEY&callback=initMap"
  type="text/javascript"></script>