Google Maps is one of the most integrated navigation tool readily available to everyone for use to direct customers to their own physical business or organization locations.
With the use of geolocations, street view, and other features supported by Google Maps, customers and clients are able to navigate and see a preview of the location of the business or organization before visiting their office or store, reducing late arrivals and lost walk-in prospects.
However, with recent changes made on the application programming interface (API), most web developers building websites with Google Maps integrated on it are receiving errors about Google Maps not loading correctly.
Over on Twitter, there are a bunch of users experiencing this error- check them out:
Oops! Something went wrong.
— Ethan Hays (@ethanhays) May 7, 2018
What Causes this Error?
However, those using Google Maps API after June 22 will be seeing errors when using Google Maps API with a blank API Key because Google now stops support for keyless access. There are major changes on the API and script use for Google Maps, so it is best to check it out before integrating Maps to your own website.
Quick Video Fix
How to Fix this Error
1st Fix: Get a Key
Since the June 22, 2016 update, Google Maps API no longer supported keyless access. The API Key is unique to every user who requested it. To get your key, simply follow these steps which are outlined by LaTecnosfera:
- Click here to obtain a unique API Key To add, a free API key only supports 25,000 map loads per project per day. Premium Plan Cloud API users get higher volume than the regular map load maximum limit. You can also check Premium Plans by clicking here. As a Google Maps APIs Premium Plan customer, you have the option to use an API Key or a valid client ID each time you load the API. You can check more information about authentication parameters designed for Premium Plan customers in this link.
- Depending on the web platform or website service you are using, you can access your Google Map’s script code on the web service you are using. For those who are not direct web developers of their website, it is best to seek assistance from a competent web developer to avoid future problems when altering or editing your webpage script code. For those subscribed to paid web services, please talk to your user support / technical support for assistance.
- Once you saved the code, wait for 5 minutes to refresh your webpage. If all goes well, congratulations!
Video Guide: How To Set Up A Google Maps API key
2nd Fix: Enable your API Library
- Go to the GCP Console API Library
- Select the project used to create the code for your Google Maps API
- On the API Page, click on Enable.
- Once enabled, you can see a comprehensive data table of your Google Maps API like traffic, errors, and latencies.
- You can refresh your webpage to check if Maps is successfully showing you locations. If it works well, congratulations!
Video Overview: Getting Started with Google APIs (Python)
- Google Maps were working fine on some of his pages, so he was unsure was the issue was.
- Other users pointed out to him that Google had changed its terms regarding the usage of Google Maps and that it no longer supported keyless access.
Another computer expert explained that if you had been using Google Maps on your site before the implementation of API keys on 22nd June 2016, it would probably work normally. However, if you want to use Google Maps after 22nd June, you’d need to get an API key to load the maps. The user adds that you can get it from the Google Developers website.
Another individual remarks that the API key is valid for 25,000 requests per day and that if your requests exceed that number, you’ll need a digital signature. The person also states that using Google Developers site is an excellent solution if you’re not certain how to get an API key, but he warns that you’ll have to create a billing account and think about restricting your key’s usage.
- He also explains that if you’re a using a premium plan with client parameters, there are additional steps you have to take.
- The user states that if you see that the page can’t load Google maps, then you haven’t authorized the URL, on which you’re loading the API.
- To fix that problem, you should log into your Google Cloud Support Portal > Maps > Manage Client ID.
A person said that he did all the right steps to acquire an API key and inserted it in the right spot. However, he kept getting the same mistake that Google maps were not loading correctly. However, once he thought about it, he realized that he had actually missed to do something and that was to enable the API for use on the site.
A user commented that he also couldn’t get the Google maps to load properly and that he spent a lot of hours looking for the problem. However, it turned out that he had mistyped the domain name when getting the API key and that correcting the name of the domain in the Google API site fixed the problem.
An individual recommends that you read through the Error Message section of the Google Developers Website and that it would give you a good idea where to start looking for the issue. He also states that you should first recheck that your API key is valid and that you are not in conflict with the restrictions.
If you are a visitor of the website and you encounter this type of error, send the owner of the website a message right away to let them know of this Maps issue. However, if the website has heavy traffic and is supported only with a free API key, you will surely encounter a message that the developer has reached the maximum loads for Google Maps integrated on their webpage for that day.
Ryan is a computer enthusiast who has a knack for fixing difficult and technical software problems. Whether you’re having issues with Windows, Safari, Chrome or even an HP printer, Ryan helps out by figuring out easy solutions to common error codes.