I’ve been successfully using Google maps js API on this website for a long while but it has recently stopped working and displaying the dreaded “This page can’t load Google Maps correctly.” and I can’t figure out why. I have ensured that the key is still valid, it has no restrictions associated with it, I have a payment method attached to my account. I’ve gone through the entire troubleshooting section of the Google support documents but none of the potential issues match my situation. Here is an example document with the map embedded: https://menacerp.com/fivemin/mapsissue.html .
If anyone has any insight on why this is happening to me, I’d be very grateful to hear it.
Hi there, thank you for supplying the test page. That helps out tremendously.
Google saying on the map “Do you own this website?” on the map certainly points to an issue.
I ran the API key through this Google API key checker and it claims that there is an issue. Digging deeper about the API key is where I would advise to investigate further.
On checking the network panel, I see the following information from the QuotaService request:
/**/_xdc_._hbu19h && _xdc_._hbu19h( [0,null,0,null,null,[2,"https://developers.google.com/maps/documentation/javascript/error-messages?utm_source=maps_js\u0026utm_medium=degraded\u0026utm_campaign=billing#api-key-and-billing-errors","You must enable Billing on the Google Cloud Project at https://console.cloud.google.com/project/_/billing/enable Learn more at https://developers.google.com/maps/gmp-get-started"]] )
It took me a very long time to sort it but thanks to you explaining how to check network for responses, I was able to solve each issue, step by step. I never would have thought of that myself. Thank you again for the help!
I was wary to post my solution because it was quite a few steps that I took, some of which might not have been necessary.
First, I couldn’t get any existing keys to work so I created a new project and key. That didn’t solve the issue so I then applied billing to that particular project. That didn’t solve the issue so I then enabled APIs (geocoding, geoloction, maps enabled, maps javascript , maps static) until it started working.
I believe most if not all of the steps I took were necessary, unfortunately working in the Google consoles is a very confusing process, as almost everything is separate to each other and the process of simply creating a key to use will require 3 or so control panels and steps that are buried in hamburger menus of each in some cases, right-clicks of panel elements in others.
I really miss the days of creating an API key for Google maps and then using it.