오래전에 구글 지도를 연동시킨 워드프레스 사이트에서 "죄송합니다. 문제가 발생했습니다. Google 지도가 제대로 로드되지 않았습니다. 자바스크립트 콘솔에서 자세한 기술 정보를 확인하세요" 오류가 발생하는 문제가 발생했습니다.
Google 지도가 제대로 로드되지 않았습니다: RefererNotAllowedMapError 오류
구글 지도 로딩 오류가 발생하는 경우 브라우저 콘솔에 오류 메시지가 표시되지 않는지 먼저 체크해 보면 좋습니다.
해당 사이트에서는 다음과 같은 에러 메시지가 표시되고 있었습니다.
js?key=구글맵API키&libraries=places&language=ko&callback=Function.prototype&ver=1.3.102:220 Google Maps JavaScript API error: RefererNotAllowedMapError여기서 에러의 원인을 파악할 수 있는 핵심 메시지는 "Google Maps JavaScript API error: RefererNotAllowedMapError" 부분입니다.
RefererNotAllowedMapError 오류가 표시되면 Google Maps Platform에 로그인하여 HTTP 리퍼러 설정을 확인하여 해당 도메인을 제대로 등록되어 있는지 체크하시기 바랍니다.
API 및 서비스 » 키 및 사용자 인증 정보로 이동하여 API 키에서 해당 API 키를 누르도록 합니다.
HTTP 리퍼러를 살펴보니 기존 도메인이 추가되어 있어서 오류가 발생하고 있었습니다.
즉, 클라이언트께서 사이트의 도메인을 변경하면서 HTTP 리퍼러 설정을 업데이트하지 않아서 발생하는 문제였습니다. 기존 도메인을 새 도메인으로 변경하니 곧바로 구글 지도 로딩 오류가 사라지면서 지도가 올바르게 표시되었습니다.
https://example.com/*과 같은 형식으로 웹사이트를 추가하거나 수정하여 문제가 해결되는지 체크하시기 바랍니다. 만약 www 도메인을 사용한다면, https://www.example.com/*과 같은 포맷으로 추가하면 될 것입니다.
구글 지도가 제대로 로드되지 않는 오류가 발생하는 경우 다음 글을 참고하여 문제 해결을 시도해보시기 바랍니다.
구글지도가 제대로 로드되지 않는 문제가 발생하는 경우 [업데이트]
이 블로그에서 구글맵과 관련된 문제를 단편적으로 몇 개의 글에서 다루었습니다. 종합적으로 정리해야 할 때가 되었다는 생각하고 있었지만 좀처럼 시간을 내지 못하다가 오늘 마음먹고 정리
www.thewordcracker.com
사이트에 구글맵 API를 사용하고 있는 상태에서 사이트의 도메인을 변경하는 경우 HTTP 리퍼러 설정에서 해당 도메인을 변경해야 구글 지도가 제대로 표시됩니다.
참고로 구글 크롬 브라우저의 콘솔에서 다음과 같은 경고가 표시되고 있었습니다.
As of February 21st, 2024, google.maps.Marker is deprecated. Please use google.maps.marker.AdvancedMarkerElement instead. At this time, google.maps.Marker is not scheduled to be discontinued, but google.maps.marker.AdvancedMarkerElement is recommended over google.maps.Marker. While google.maps.Marker will continue to receive bug fixes for any major regressions, existing bugs in google.maps.Marker will not be addressed. At least 12 months notice will be given before support is discontinued.
이 경고를 대략적으로 번역하면 다음과 같습니다.
2024년 2월 21일자로 google.maps.Marker가 사용이 중단되었습니다. 대신 google.maps.marker.AdvancedMarkerElement를 사용하세요. 지금은 google.maps.Marker가 중단이 예정되어 있지는 않지만, google.maps.Marker보다는 google.maps.marker.AdvancedMarkerElement를 사용할 것을 권장합니다.
지원이 중단되기 최소 12개월 전에 고지가 될 것이라고 하네요. 구글 개발자 문서에서 자세한 정보를 확인할수 있습니다.
참고
https://avada.tistory.com/2897
엘리멘터 무료 버전 vs. 프로 버전 비교
엘리멘터(Elmentor)는 500만 개가 넘는 사이트에 설치되어 사용되고 있는 인기 워드프레스 페이지 빌더 플러그인입니다. 엘리멘터는 무료 버전과 프로 버전으로 제공됩니다. Elementor 프로 버전에서
avada.tistory.com
https://avada.tistory.com/2335
워드프레스 GeneratePress 테마 라이선스 (+요금제)
워드프레스에는 정말 많은 테마가 있습니다. 테마 라이선스는 테마마다 조금씩 다릅니다. 아바다, 엔폴드, 뉴스페이퍼 등 테마포레스트 테마의 경우 동일한 라이선스가 적용됩니다(참고). Generat
avada.tistory.com
https://avada.tistory.com/3046
해외웹호스팅: 클라우드웨이즈 vs. 블루호스트 vs. 카페24 비교 (Cloudways vs. Bluehost vs. Cafe24)
저는 오랫동안 블루호스트(Bluehost)를 이용해 왔으며 2021년부터는 클라우드웨이즈(Cloudways) 웹호스팅 서비스도 함께 이용하고 있습니다. 현재 일부 중요하지 않는 블로그는 Bluehost에서 호스팅되고
avada.tistory.com
