How I Fixed “This Page Can’t Load Google Maps Correctly”

Rate this post

Many people have been seeing this “can’t load Google Maps” error since late 2018 – it’s related to the pricing which Google has introduced for their Google Maps service. Yes, that’s right, it’s not (quite) free any more.

Whereas most users were previously able to use Maps for free, Google now insist that you add your credit card – even if you plan to spend $0 (which will the case for some). You’ll then also need to replace the key, change or re-generate the Maps code, and so on. A nightmare!

If you don’t want to add your credit card to Google and just want to use maps right away then you can use our FREE API KEY here. It’s fully customizable and – importantly – free for life.

It is a real pain that Google decided to do this without much warning. Read on to see how to fix this error instantly.

How to fix “This page can’t load Google Maps” error:

The most common solution is that you need to:

  1. Login to Google Cloud
  2. Update/Add your Credit Card details
  3. Then your old Google Map will work after a few minutes.

How to debug the error manually (ADVANCED)

If you want to debug the issue yourself and don’t mind re-generating the keys from Google then read on. The first step is to debug the issue – as there may be many reasons why this is occurring.

You can open the JavaScript console in your browser with a few keystrokes. There is an excellent answer on StackOverflow that tells you plainly how to view the JavaScript console in your browser – Chrome, Firefox or others.

There are the errors that can exist after doing the above steps to view the error in the console:

  • MissingKeyMapError – API key (valid or not) is not added to your code
  • ApiNotActivatedMapError – API is not enabled
  • InvalidKeyMapError – The API key used is incorrect

The most likely one you will see is the last – InvaludKeyMapError – this means that you need to update your credit card details with Google here:

Confusingly, this is within Google Cloud – not Google Maps. They don’t make it easy to understand – if you are not an advanced user then we seriously recommend to use the free API key listed for everyone here. It only takes a few seconds to customize.

Armed with this information, let’s delve in some more:

  • Go to the Google Maps Platform welcome page then click Get Started.
  • Choose “Maps, Routes and Places” (all three) then click Continue
  • Fill out the form as below:.
Embedding a Google map – select the Platform first

I’m still having problems!?

Here are a few things to check if you are still seeing the “This page didn’t load Google Maps correctly” error.

  1. Wait ten minutes. Caching in browsers today can be aggressive – wait 5-10 minutes and check again.
  2. Check the console again. Return to the segment above on recognizing the reason for the blunder. It is conceivable that you had two mistakes in the first place yet just unraveled one or that the one blunder remains since you didn’t change the settings effectively. one error remains because you did not tweak the settings correctly.
  3. Clear your browser cache. In case you’re utilizing a storing module, cleanse it’s reserve. Something else, your key probably won’t be utilized immediately. It doesn’t hurt to clear your program store either.


21 thoughts on “How I Fixed “This Page Can’t Load Google Maps Correctly”

  1. Wow great stuff. Very useful, finally got this horrid warning off my public site. Customers were not happy. Thank you. Sarah

  2. Thanks, perfect! Dunno why Google didn’t make more of a big deal out of the fact they were CHANGING THIS !!!

  3. saved me so much time. by the way do you know if goggle is going to introduce a different pricing structure for their maps? as we are using it on our camping site and cant afford to pay any more than we already are, we are a struggling small business x

  4. i have already setup my accoount for google map javascript api . after that black portion will dissappear but it the error remain same. i’m using library “places”

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.