Date Helper 개발일지 #5 – 현실적인 선택, 구글과 카카오의 공존 (2025.03.31)

문제의 연장 – “지도 미리보기”가 보이지 않는다..

GPT 기반 추천 문제를 해결하며 Kakao 장소 검색 API로 전환했지만,
새로운 이슈가 발생했다.

바로 썸네일 옆에 지도 미리보기 이미지가 표시되지 않는 문제였다.

 

지도 미리보기가 깨짐..(카카오API)

 

🔍 원인 분석 .. !

Kakao Static Map API의 한계

• 클라이언트에서 직접 호출 → CORS 문제 발생
• 백엔드에서 이미지 받아 Base64로 전송 → 이미지 깨짐 & 속도 이슈 발생

그래서 그냥 Google API를 사용하는게 어떨까 생각했다.

 

 

✅ Google Static Map API 도입

결국 지도 썸네일 이미지는 Google Static Map API로 전환했다.

장점은 다음과 같다:

• 이미지 URL을 <img>로 바로 불러올 수 있음
• 위치 정확도 높고, 깔끔한 지도 스타일
• 빠른 로딩 속도

썸네일 정상적으로 표출

 

클릭하면 Kakao place_url로 이동! 

지도 이미지를 클릭하면 카카오 장소 상세 페이지로 이동하도록 구성했다.

왜냐하면:

• 카카오 place_url은 장소 이름, 주소, 리뷰, 사진 등 풍부한 정보 제공
• Google Maps에서는 place_id 기반 세팅이 복잡하고 비용도 발생

썸네일은 Google,
클릭은 Kakao → 현실적이고 최적의 조합 !!

 

결국 API 응답은 아래와 같은 JSON 구조로 구성시켰다.

 

{
  "place_name": "롯데시네마 홍대입구",
  "thumbnail": "/images/thumbs/cinema.jpg",
  "static_map_url": "https://maps.googleapis.com/maps/api/staticmap?...",
  "place_url": "https://place.map.kakao.com/12345678"
}

 

프론트에서 이 JSON을 받아 바인딩하면 썸네일+주소+지도+링크 모두 구성된다!

 

 

 

 

다음 스텝   🔜

Date Helper는 이제 현실적인 추천을 넘어서
AI + 사용자 경험 + 데이터 관리까지 한 발 더 나아가려고 합니다.

 

1. OpenAI 연동 재구성 – AI와 대화하며 데이트 코스 추천 ? 

현재는 OpenAI GPT API를 제외한 방식으로 장소 추천을 구성하고 있지만,
여전히 GPT는 사용자 편의성 면에서 중요한 역할을 할 수 있습니다.

 

 

 

2. 로그인 기능 – “내 데이트 기록”을 저장할 수 있다면?

로그인 기능을 도입하여 사용자 기반 기능도 고려합니다.

• 즐겨찾기 / 내 코스 저장..? 
• 추천 결과 히스토리 조회..?

📌 기본적인 OAuth(Google)부터 시작해서
차후 JWT 기반 인증도 적용 예정입니다.

 

 

3. 데이터베이스 연결 – 내 정보, 내 코스, 관리 가능하게

백엔드에 Flask를 쓰고 있는 만큼,
SQLite 또는 MySQL 연동으로 코스 데이터 저장도 준비 중입니다.

• 추천 결과를 DB에 저장
• 사용자별 저장한 코스 관리
• 장소 정보/API 결과 캐싱으로 성능 최적화