뷰 이벤트 로직을 수정하는 방법도 있지만, 사용자의 새로고침 여부처럼 나중에 필요할 수도 있는 분석을 위해 그대로 두었습니다. 대신 새로운 이벤트 유형인 퍼널 이벤트를 추가로 잡았습니다.
퍼널 이벤트의 경우 메인 페이지 진입, 제품 상세페이지 진입, 장바구니 담기 등 유저가 사전에 정의한 퍼널에 진입할 때 발생하도록 했습니다. 또한 퍼널 이벤트는 다른 퍼널에서 진입하는 경우만 발생하며, 새로고침이나 리렌더링 시에는 발생하지 않도록 했습니다.
퍼널 이벤트 구현에는 브라우저의 Session Storage를 활용했습니다. Session Storage란 브라우저의 탭마다 생기는 작은 저장소이고, 탭이 종료되면 내용이 삭제되는 특성을 가진 브라우저 저장소인데요. 아래는 Session Storage를 통해 새로고침, 리렌더링 이슈의 영향을 받지 않고 현재 퍼널과 직전 퍼널의 구매 여정 단계를 구했던 방법입니다.
1. Session Storage에는 현재 퍼널, 직전 단계 퍼널을 저장합니다.
a. 현재 퍼널은 currentFunnel, 직전 퍼널은 prevFunnel라는 이름의 변수에 저장합니다.
b. 첫 진입일 경우 prevFunnel은 null로 저장합니다.