이 문서는 Google 애널리틱스를 사용하여 단일 페이지 애플리케이션의 페이지 조회수를 측정하려는 개발자를 위한 것입니다.
단일 페이지 애플리케이션 (SPA)은 HTML 문서를 한 번 로드하고 JavaScript API를 사용하여 추가 콘텐츠를 가져오는 웹사이트입니다.
예: 잠재고객을 확보하기 위한 양식이 있다고 가정해 보겠습니다. 양식에는 세 개의 화면이 있습니다.
- 고객 정보를 캡처하는 첫 번째 화면
- 고객이 특정 서비스에 관심을 보이는 두 번째 화면
- 고객의 관심분야와 관련된 웹 세미나에 가입하는 세 번째 화면 페이지
SPA에서 페이지 조회수를 올바르게 측정하는 핵심은 사용자가 상호작용하는 각 화면의 페이지 조회수를 집계하고 페이지 리퍼러를 올바르게 가져와 사용자 여정을 올바르게 추적하는 것입니다.
시작하기 전에
이 페이지에서는 다음이 이미 있다고 가정합니다.
단일 페이지 애플리케이션 측정 구현
정확한 SPA 측정을 구현하려면 다음 방법 중 하나를 사용하여 새 가상 페이지 조회수를 트리거하세요.
브라우저 방문 기록 변경 (권장): SPA에서 방문 기록 API, 특히
pushState()및replaceState()메서드를 사용하여 화면을 업데이트하는 경우 이 옵션을 사용합니다.맞춤 이벤트: 웹사이트에서
DocumentFragment객체를 사용하여 다양한 화면을 렌더링하는 경우 이 옵션을 사용합니다.
브라우저 방문 기록 변경 구현
SPA에서 방문 기록 API를 사용하는 경우 Google 애널리틱스에서 향상된 측정을 사용 설정하여 브라우저 방문 기록 이벤트를 기반으로 페이지 조회수를 자동으로 추적할 수 있습니다.
GA4에서 향상된 측정 사용 설정
브라우저 방문 기록을 기반으로 page_views를 자동으로 측정하려면 다음 안내를 따르세요.
Google 애널리틱스를 엽니다.
관리의 데이터 수집 및 수정에서 데이터 스트림 > 웹을 클릭합니다.
향상된 측정에서 스위치를 사용으로 슬라이드하여 모든 옵션을 사용 설정합니다.
개별 옵션을 수정하려면 클릭합니다. **페이지 조회수** 에서 **고급 설정 설정 표시** 를 클릭합니다. 페이지 로드 와 브라우저 방문 기록 이벤트를 토대로 한 페이지 변경사항 을 모두 사용 설정해야 합니다.
변경사항을 저장 합니다.
참고: '브라우저 방문 기록 이벤트를 토대로 한 페이지 변경사항'에 향상된 측정을 사용 설정하면 Google 애널리틱스에서 방문 기록 이벤트 (예: SPA에서 사용되는 이벤트)를 자동으로 수신 대기하고 page_view 이벤트를 전송합니다. GA4에 페이지 조회수를 전송하기 위해 Google 태그 관리자에서 특정 방문 기록 변수 또는 트리거를 구성할 필요가 없습니다.
방문 기록 이벤트에 Google 태그 관리자 트리거 사용
다른 마케팅 플랫폼으로 데이터를 전송하는 등 브라우저 방문 기록 변경사항을 기반으로 Google 태그 관리자에서 다른 유형의 태그를 실행해야 하는 경우 '방문 기록 변경' 트리거 유형을 사용할 수 있습니다.
방문 기록 변경 트리거와 함께 작동하도록 태그 또는 변수를 구성할 때는 Google 태그 관리자에서 제공하는 올바른 기본 제공 변수 를 사용해야 합니다.
History New URL Fragment: 방문 기록 이벤트 후 URL의 프래그먼트입니다.History Old URL Fragment: 방문 기록 이벤트 전 URL의 프래그먼트입니다.History New State: 새 방문 기록 상태 객체입니다.History Old State: 이전 방문 기록 상태 객체입니다.History Source: 방문 기록 이벤트의 소스 (예:popstate,pushState,replaceState)입니다.
이러한 기본 제공 변수는 먼저 Google 태그 관리자의 변수 > 구성 에서 사용 설정해야 할 수 있습니다.
이 트리거에 관한 자세한 내용은 방문 기록 변경 트리거를 참고하세요.
측정 설정 확인
단일 페이지 애플리케이션에서 페이지 조회수를 올바르게 측정하는지 확인하려면 다음 안내를 따르세요.
SPA 측정 설정의 모든 태그에 디버그 모드를 사용 설정합니다. DebugView에서 이벤트 모니터링 방법 알아보기
단일 페이지 애플리케이션을 클릭합니다. 새 가상 화면을 클릭하면 DebugView에 새
page_view이벤트가 표시됩니다.page_view이벤트 매개변수를 이전page_view이벤트와 비교하여 페이지 리퍼러와 페이지 위치가 올바르게 업데이트되었는지 확인합니다.
자동 이벤트에 미치는 영향
SPA에서 가상 페이지 조회수 측정을 올바르게 구현하면 Google 애널리틱스에서 다른 자동 이벤트를 적절하게 처리합니다. 화면 변경에 가상 페이지 조회수가 기록되지 않으면 Google 애널리틱스에서 SPA를 단일 페이지로 처리하여 측정항목이 왜곡됩니다.
예를 들어 user_engagement 이벤트는 사용자가 페이지에서 적극적으로 보낸 시간을 측정합니다. 가상 페이지 조회수가 없으면 모든 참여 시간이 초기 페이지 로드에 기여 분석되므로 개별 화면에서 보낸 시간을 분석할 수 없습니다.
가상 페이지 조회수 측정이 올바르게 구현되면 다음이 적용됩니다.
- 사용자가 한 가상 페이지에서 다른 가상 페이지로 이동할 때
user_engagement이벤트가 전송됩니다. - 이전 가상 페이지의 참여 시간이 계산되어
user_engagement이벤트와 함께 전송됩니다. 일반적으로 새 가상 페이지의page_view이벤트가 처리되기 직전에 전송됩니다. - 클릭 또는 스크롤과 같은 다른 이벤트는 사용자가 현재 보고 있는 가상 페이지의
page_location과 연결됩니다.
이를 통해 SPA 내의 개별 화면 또는 섹션의 사용자 참여 및 기타 측정항목을 분석하여 사용자 여정을 더 정확하게 파악할 수 있습니다.