Google Maps error: Oops! Something went wrong. This page didn't load Google Maps correctly

Question

First time asking on stackoverflow, so be patient if I break some rule, tried my best to solve by myself searching for a solution, but had no luck.

I used a tool to

Answer 1

I encountered the same problem. My page suddenly started showing grey window and the error instead of the map which was working fine till some time back.

I looked for the solution. It turned out that the the google map API requires developer key since few days ago. Register for the Google Api key and mention it in your code.

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

Get YOUR_KEY from google api console. My map works good now.

Answer 2

Quick F12 to developer console and reload gives:

MissingKeyMapError and points to https://developers.google.com/maps/documentation/javascript/error-messages for reference.

Answer 3

in google latest update you should add your key for each script for googleapis.com (otherwise google map will not working)i.e

<script src="http://maps.googleapis.com/maps/api/js?key=your_key"></script>

and if you want to use other features like places,geoloaction then add below line also

<script src="//maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places&key=your_key" async="" defer="defer" type="text/javascript"></script>

Note:for places,geolocation and other features you should enable it from google console for more detail about features enabling check this out
https://stackoverflow.com/a/41079098/6295712

Answer 4

I have an api key, the maps all load fine with web pages on the computer... but not while loading the same pages and maps on a mobile, this goes for normal web page maps and mobile web page maps... computer fine but mobile returns the Sorry! Something went wrong. This page didn't load Google Maps correctly! See Javascript console.... but javascript console doesn't return any errors! I have checked the web pages that load the maps on iPhone and Samsung and they return the error, same pages from a computer browser and they load without error, same urls!

So eventually I discovered the error: I added the url in the Google maps api account with www.domain.... while this did not appear to be an issue with browsers on my computer, it did on mobile phones... so I found that adding 2 URL's in the api www.domain.com/page and domain.com/page fixed the error, and the maps loaded on mobile devices as well as on computers!

Answer 5

In my case, it was a restriction related issue. I had used wildcards as suggested by the example in the "Website restrictions" in the Google console

 *example.com/*

the wildcard did not work! I had to use the complete address of the page on which the API was implemented.

 mysite.com/contact-page/

I hope this is of help for someone.