user192632 user192632 - 5 months ago 31
Javascript Question

google not recognizing my api key

I have created a google developers account. I have created a project in there. I have enabled the JavaScript maps API for the project, and I have created a browser key for it, and I have limited the usage of it to the domain of my web site that people will be viewing. When I go to do an autocomplete call on a form field in my page, I get the following error back in the response.

"This service requires an API key. For more information on authentication and Google Maps JavaScript API services please see: https://developers.google.com/maps/documentation/javascript/get-api-key"


So I read the page, and that's how and why I set everything up previously mentioned. But it still will not work, and I just can't figure out why.

What subtlety am I missing?

BTW, this is with Chrome if that means anything, haven't bothered with other browsers

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=places&region=us" key="xxxxxxxxxx-xxxxxxxxxx-xxxxxxxxxx"></script>

Answer

You're setting an HTML attribute. The key should instead be included in the src URL according to the link you posted.

Straight from their example:

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

Notice the location of "YOUR_API_KEY" in the URL. Your best bet when dealing with APIs like this is to look for examples and follow them as closely as you can, trying to understand them. Then modify them to suit your needs.