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

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.


Quick F12 to developer console and reload gives:

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


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