javascript 뒤로가기

모바일 웹의 경우 보통 모든 페이지의 최상단에 뒤로가기(←) 버튼이 존재합니다.

 

보통의 경우는 상관없지만 때로는 외부에서 child 페이지로 바로 접근하는 경우 가장 많이 알려진 것 중 하나인 history.back()을 사용할 경우 아무런 동작을 하지 않는 문제가 있습니다.

 

이 경우 document.referrer을 사용하면 해결할 수 있습니다.

document.referrer은 링크를 통해 현재 페이지로 이동 시킨, 전 페이지의 URL 정보를 반환합니다.

 

https://developer.mozilla.org/ko/docs/Web/API/Document/referrer

Document.referrer - Web API | MDN

 

따라서 바로 타이핑해서 직접 특정 페이지로 들어갈 경우 이 referrer가 존재하지 않음로 그게 첫 페이지임을 알 수 있습니다.

 

if ( document.referrer ) { 
  // 뒤로가기
  history.back();
}

// 히스토리가 없으면,
else { 
  // 메인 페이지로
  location.href = "http://m.naver.com";
}

 

위와 같이 할 경우 뒤로 가기 할 곳이 없을 때 메인 페이지로 이동할 수 있습니다.