diff --git a/app/create/page.tsx b/app/create/page.tsx index 474e94a..b29faa4 100644 --- a/app/create/page.tsx +++ b/app/create/page.tsx @@ -145,7 +145,7 @@ export default function Page() { // --- [GA4 이벤트 전송 로직 추가] --- if (typeof window !== 'undefined') { - // 1. 브라우저 식별자(browser_id) 확인 및 생성 (Get or Create) + // 브라우저 식별자(browser_id) 확인 및 생성 (Get or Create) let browserId = localStorage.getItem('browser_id'); if (!browserId) { // 없으면 새로 발급해서 브라우저에 각인! @@ -154,7 +154,10 @@ export default function Page() { localStorage.setItem('browser_id', browserId); } - // 2. 방 만든 브라우저가 누구인지 식별자를 담아서 이벤트 전송 + // 방장임을 증명하는 마패(로컬스토리지) 발급! + localStorage.setItem(`is_host_${meetingId}`, 'true'); + + // 방 만든 브라우저가 누구인지 식별자를 담아서 이벤트 전송 sendGAEvent('event', 'url_created', { meeting_url_id: meetingId, participant_count_expected: capacity, diff --git a/app/meeting/[id]/page.tsx b/app/meeting/[id]/page.tsx index 64b5433..4d46da8 100644 --- a/app/meeting/[id]/page.tsx +++ b/app/meeting/[id]/page.tsx @@ -15,6 +15,7 @@ import MeetingInfoSection from '@/components/meeting/MeetingInfoSection'; import { useToast } from '@/hooks/useToast'; import Toast from '@/components/ui/toast'; import { getMeetingUserId, removeMeetingUserId } from '@/lib/storage'; +import { sendGAEvent } from '@next/third-parties/google'; interface StationInfo { line: string; @@ -73,8 +74,33 @@ export default function Page() { } }, [isError, error, id]); + // GA4 전송 전용 도우미 함수 + const trackShareEvent = () => { + if (typeof window !== 'undefined') { + let browserId = localStorage.getItem('browser_id'); + if (!browserId) { + browserId = `bid_${Math.random().toString(36).substring(2, 15)}${Date.now().toString(36)}`; + localStorage.setItem('browser_id', browserId); + } + + sendGAEvent('event', 'share_link', { + meeting_url_id: id, + location: 'creation_complete', + browser_id: browserId, + }); + } + }; + + // 공유하기 버튼 전용 핸들러 const handleShareClick = (e: React.MouseEvent) => { openModal('SHARE', { meetingId: id }, e); + trackShareEvent(); + }; + + // 재촉하기 버튼 전용 핸들러 + const handleNudgeClick = (e: React.MouseEvent) => { + openModal('NUDGE', { meetingId: id }, e); + trackShareEvent(); }; const handleSelectStation = (stationName: string | null) => { @@ -109,6 +135,23 @@ export default function Page() { { onSuccess: () => { refetch(); + + if (typeof window !== 'undefined') { + let browserId = localStorage.getItem('browser_id'); + if (!browserId) { + browserId = `bid_${Math.random().toString(36).substring(2, 15)}${Date.now().toString(36)}`; + localStorage.setItem('browser_id', browserId); + } + + const isHost = localStorage.getItem(`is_host_${id}`) === 'true'; + const userRole = isHost ? 'host' : 'participant'; + + sendGAEvent('event', 'departure_location_submitted', { + meeting_url_id: id, + user_cookie_id: browserId, + role: userRole, + }); + } }, onError: () => { setErrorMessage('출발지 등록에 실패했습니다.'); @@ -244,7 +287,7 @@ export default function Page() {