How to Fix Google Maps Javascript API Error

Google Maps Javascript API v2 is no longer available and There are lots of changes between v2 and v3. Thats why all old API based maps are broken/not working and showing “Sorry something went wrong” like this screenshot:

Also console/developer tools showing error by saying:

Google Maps API error:

MissingKeyMapError https://developers.google.com/maps/documentation

/javascript/error-messages#missing-key-map-error

Now, I am going to show you how to fix this Google Maps Javascript API Error – step by step  by upgrading your Google Maps API to Version 3 and make your google map fully working.

Steps:

1. First of all you have to go to Maps JavaScript API Portal and then, click to Get a Key Button from Right-top.

2. Now, You have to create a project by giving a name and then, click to Create and enable API

3. You will get your API key within few seconds then, copy your key -> save it anywhere for future uses and then, go to docs.

4. When you are on docs page copy API URL:

https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY

also you can learn more about API from here and can explore map examples.

5. Now, go to your contact.html page to replace old API with new one. Remove old API and make it like this screenshot by inserting new API URL and key:

6. Save your contact.html file and hard reload your contact page on browser [You’re done!]

If you have any questions or opinion, feel free to post it by commenting on post.