#03. ttip(띱) - KOPIS API 연동 & 기능 개선

오늘은 ttip 서비스에 몇 가지 기능 개선 작업을 진행했습니다.

1. KOPIS API 연동 — 대구 공연/전시 431건 수집

기존에는 한국관광공사 API로 문화행사 데이터를 수집하고 있었는데, 공연/전시 데이터가 부족하다는 걸 느꼈습니다. 

그래서 KOPIS(공연예술통합전산망) API를 추가로 연동했습니다.

KOPIS API는 JSON이 아닌 XML 응답 방식이라 simplexml_load_string()으로 파싱해야 했습니다. 

기존 한국관광공사 데이터와 충돌을 방지하기 위해 event_seq 필드에 kopis_ 접두사를 붙여 같은 테이블에 저장했습니다.

또한 인터파크, yes24 같은 예매 링크를 우선 저장하는 로직을 넣어서, 

상세 페이지에서 예매 링크가 있는 공연은 "예매하기" 버튼이 뜨도록 구현했습니다.

첫 수집 결과 431건이 DB에 저장됐고, 

기존 한국관광공사 수집 커맨드와 별개로 매일 새벽 3시 30분에 자동 수집되도록 스케줄링했습니다.

 

Schedule::command('app:fetch-cultural-events')->dailyAt('03:00');
Schedule::command('app:fetch-kopis-events')->dailyAt('03:30');

 

2. 문화행사 검색 기능 추가

데이터가 많아지면서 원하는 공연을 찾기 어려워졌습니다. 프론트엔드에서 실시간 필터링하는 방식으로 검색 기능을 추가했습니다.

이미 props로 전체 데이터가 넘어와 있기 때문에 서버 요청 없이 즉시 필터링이 가능합니다.

공연명 + 장소로 동시 검색
카테고리 필터(공연/전시/축제)와 함께 사용 가능
검색 결과 없을 때 "검색 초기화" 버튼 제공
뒤로가기 시 검색 상태 복원

3. 카카오 공유 버튼 오류 수정

게시글 상세 페이지의 카카오 공유 버튼을 누르면 아래와 같은 에러가 발생했습니다.

TypeError: Cannot read properties of undefined (reading 'sendDefault')

원인을 보니 ShareButtons.vue 컴포넌트에서 구버전 SDK 방식인 Kakao.Link를 사용하고 있었습니다. 현재 사용 중인 Kakao SDK 2.7.2는 Kakao.Share를 사용해야 합니다.

 

// 수정 전 (구버전)
window.Kakao.Link.sendDefault({ ... });

// 수정 후
window.Kakao.Share.sendDefault({ ... });

 

퀴즈 페이지는 이미 올바르게 Kakao.Share로 작성돼 있었는데 ShareButtons 컴포넌트만 구버전 코드가 남아 있었던 거였습니다.

---

마치며

KOPIS API 연동으로 문화행사 데이터가 훨씬 풍부해졌고, 

검색 기능 추가로 원하는 공연을 바로 찾을 수 있게 됐습니다. 

앞으로도 꾸준히 대구 관련 데이터를 늘려갈 예정입니다.

ttip(띱)에 한번씩 놀러오세요~

ttip - 대구를 더 잘 알고 싶다면