javascript 뒤로가기 방지 코드

  history.pushState(null, null, location.href);
  window.onpopstate = function (event) {
      history.go(1);
  };

참고: http://stackoverflow.com/questions/16182993/how-to-prevent-a-browser-from-going-back-forward-in-history-when-scrolling-horiz

How to prevent a browser from going back/forward in history when scrolling horizontally?

 

 

MDN: history.go()

https://developer.mozilla.org/ko/docs/Web/API/History/go

History.go() - Web API | MDN

 

MDN: history.pushState()

history.pushState() 메서드는 브라우저의 세션 기록 스택에 상태를 추가합니다.

 

state 새로운 세션 기록 항목에 연결할 상태 객체. 사용자가 새로운 상태로 이동할 때마다 popstate 이벤트가 발생하는데, 이 때 이벤트 객체의 state 속성에 해당 상태의 복제본이 담겨 있습니다.상태 객체는 직렬화 가능한 객체라면 모두 가능합니다.

 

title 지금은 대부분의 브라우저가 title 매개변수를 무시하지만, 미래에 쓰일 수도 있습니다. 빈 문자열을 지정하면 나중의 변경사항에도 안전할 것입니다. 아니면, 상태에 대한 짧은 제목을 제공할 수도 있습니다.

 

url Optional 새로운 세션 기록 항목의 URL. pushState() 호출 이후에 브라우저는 주어진 URL로 탐색하지 않습니다. 그러나 이후, 예컨대 브라우저를 재시작할 경우 탐색을 시도할 수도 있습니다. 상대 URL을 지정할 수 있으며, 이 땐 현재 URL을 기준으로 사용합니다. 새로운 URL은 현재 URL과 같은 출처를 가져야 하며, 그렇지 않을 경우 예외가 발생합니다. 지정하지 않은 경우 문서의 현재 URL을 사용합니다.

 

https://developer.mozilla.org/ko/docs/Web/API/History/pushState

History.pushState() - Web API | MDN

 

MDN: onpopstate

window의 popstate 이벤트 핸들러

같은 document에 관한 두개의 히스토리 엔트리에 변화가 일어날 때마다, popstate event가 window 객체에 붙게 된다. 만약 활성화된 엔트리가 history.pushState() 메서드나 history.replaceState() 메서드에 의해 생성되면, popstate 이벤트의 state 속성은 히스토리 엔트리 state 객체의 복사본을 갖게 된다.

history.pushState() 또는 history.replaceState()는 popstate 이벤트를 발생시키지 않는 것에 유의한다.popstate 이벤트는 브라우저의 백 버튼이나 (history.back() 호출) 등을 통해서만 발생된다. 그리고 그 이벤트는 같은 document에서 두 히스토리 엔트리 간의 이동이 있을 때만 발생이 된다.

브라우저는 popstate 이벤트를 페이지 로딩시에 다르게 처리한다. Chrome(v34 이전버전) 와 Safari는 popstate 이벤트를 페이지 로딩시에 발생시킨다. 하지만 Firefox 는 그렇지 않다.

https://developer.mozilla.org/ko/docs/Web/API/WindowEventHandlers/onpopstate

WindowEventHandlers.onpopstate - Web API | MDN