feat: 네이버 지도 인증 실패 핸들링

- navermap_authFailure 전역 콜백 등록 → 잘못된 키/미등록 도메인 시 지도 폴백에 원인 표시
- 키만 넣으면 실좌표 마커가 렌더되도록 정비

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

src/components/NaverMap.vue

@@ -12,7 +12,7 @@
 
 <script setup lang="ts">
 import { onBeforeUnmount, onMounted, ref, watch } from 'vue'
-import { loadNaverMaps } from '@/lib/naverMap'
+import { loadNaverMaps, onNaverAuthFailure } from '@/lib/naverMap'
 import type { Spot } from '@/api/spots'
 
 const props = defineProps<{
@@ -32,6 +32,9 @@ let infoWindow: naver.maps.InfoWindow | null = null
 const markers = new Map<number, naver.maps.Marker>()
 
 onMounted(async () => {
+  onNaverAuthFailure(() => {
+    errorMsg.value = '지도 인증 실패 · NCP 키가 유효한지, 서비스 URL(localhost:9000)이 등록됐는지 확인하세요.'
+  })
   try {
     const nv = await loadNaverMaps()
     if (!mapEl.value) return

src/lib/naverMap.ts

@@ -2,6 +2,12 @@
 // 키는 네이버 클라우드 플랫폼(Maps)에서 발급. .env 의 VITE_NAVER_MAP_CLIENT_ID 로 주입.
 let loadPromise: Promise<typeof naver> | null = null
 
+// 인증 실패(잘못된 키/미등록 도메인) 콜백. 네이버 SDK 가 전역 navermap_authFailure 를 호출.
+const authFailureHandlers: Array<() => void> = []
+export function onNaverAuthFailure(cb: () => void): void {
+  authFailureHandlers.push(cb)
+}
+
 export function loadNaverMaps(): Promise<typeof naver> {
   if (typeof window !== 'undefined' && window.naver?.maps) {
     return Promise.resolve(window.naver)
@@ -14,6 +20,11 @@ export function loadNaverMaps(): Promise<typeof naver> {
   // 신규 키는 ncpKeyId, 구형 키는 ncpClientId. 필요 시 env 로 전환.
   const authParam = import.meta.env.VITE_NAVER_MAP_AUTH_PARAM || 'ncpKeyId'
 
+  // 네이버 SDK 는 인증 실패 시 이 전역 함수를 호출한다.
+  ;(window as unknown as { navermap_authFailure?: () => void }).navermap_authFailure = () => {
+    authFailureHandlers.forEach((h) => h())
+  }
+
   loadPromise = new Promise<typeof naver>((resolve, reject) => {
     if (!clientId) {
       reject(new Error('VITE_NAVER_MAP_CLIENT_ID 가 설정되지 않았습니다.'))