Google Maps API 키를 발급받아서 잘 사용하고 있던 워드프레스 사이트에서 갑자기 "This page can't load Google Maps correctly"(Google 지도를 제대로 로드할 수 없습니다) 오류가 표시되면서 지도가 로드되지 않는 문제가 발생하여 문제를 살펴보았습니다.
구글맵 로드 오류: This page can't load Google Maps correctly
구글 지도 API 키를 올바르게 생성하여 키를 입력하면 지도가 로드되어야 합니다. 잘 되다가 갑자기 안 된다면 결제 활성화를 해야 할 수도 있습니다. 구글 클라우드 플랫폼에서 결제(Billing) 활성화를 할 수 있습니다.
무료 체험판 기간 동안 사용할 수 있는 크레딧 잔액이 유지되고, 사용한 만큼만 비용을 지불하면 된다는 메시지가 표시됩니다. "활성화"를 눌러 활성화하면 지도도 올바르게 로드될 것입니다.
이와는 별도로 "Loading the Google Maps JavaScript API without a callback is not supported" 에러가 발생할 수도 있습니다. 이 에러가 발생해도 보통은 문제없이 지도가 로드되는 것 같습니다. 이 문제 때문에 워드프레스에서 지도가 로드되지 않는다면 구글맵 관련 플러그인을 최신 버전으로 업데이트하거나 다른 플러그인으로 교체하면 문제가 해결될 것입니다.
구글 문서에서는 다음과 같은 형식으로 코드를 추가할 것을 안내하고 있습니다.
<script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"></script>
참고
https://avada.tistory.com/2739