javascript history 삭제 / href replace 비교

 

 

 

 

javascript history 삭제하기 는 불가능하다.

 

구글링 결과 javascript 로 history를 제어할 수 없는 듯 하다.

즉 클라이언트에서 권한이 없다는 것으로 예상된다.

 

미흡한 영어실력이라 해석이 잘못 됬을지도 모르지만 안되는것 처럼 보인다.

 

 

하지만 방법이 없는 것은 아닌듯 하다 ^^

 

나같은 경우는 다음과 같이 해결했다.

 

 

아래 사례들에서 history를 컨트롤 하고 싶은 충동이 생긴다.

 

1번 사례 : 게시글 수정 후 뒤로가기를 실행할 경우

 

게시글 수정 : ①게시글 상세 페이지 > ②수정 페이지 > ③게시글 상세 페이지

 

이 경우 ③게시글 상세 페이지에서 뒤로가기(history back) 을 하게되면 ②수정 페이지로 가게 된다.

 

수정 후 뒤로가기 : ③게시글 상세 페이지 > ②수정 페이지 > ①게시글 상세 페이지

 

이동한다고 해서 문제가 되진 않는다.

 

다만 수정을 완료했는데 수정하기 전 데이터를 가지고 있는 수정페이지로 이동하는 것이 필요가 없어 보인다.

 

 

 

2번 사례 : 게시글 삭제 후 뒤로가기를 실행할 경우

 

게시글 삭제 : ①게시글 목록 페이지 > ②게시글 상세 페이지 > ③게시글 삭제 후 게시글 목록 페이지

 

③게시글을 삭제 후 게시글 목록 페이지에서 뒤로가기를 누르면 ②게시글 상세 페이지로 이동하게 된다.

 

삭제 후 뒤로가기 : ③게시글 삭제 후 게시글 목록 페이지 > ②게시글 상세 페이지 > ①게시글 목록 페이지

 

물론 삭제하기 전 데이터도 함께 화면에 표시된다. 삭제된 글을 다시 볼 수 있다는 것도 역시 필요 없다.

 

위 상황들에서 ②페이지들의 history 를 삭제해서 뒤로가기 했을 때 보이지 않는다면 참 좋을텐데 그게 안되는것 같다.

 

구글링 해보면 history 의 저장된 url 배열의 length, index 를 가지고 몇번째 뒤로 보낼 것인가에 대한 이야기가 많은데 브라우저의 뒤로가기 버튼을 누른다면 소용없어 보인다.

 

1번, 2번 사례에서 ②페이지들 (수정 페이지, 게시글 상세 페이지) 을 history 에 남기지 않는다고 생각해보면 쉽게 해결 될것 같지 않는가 ?

 

 

 

그럼 먼저 history 에 url이 남는 경우들을 살펴본다.

 

submit으로 form전송을 한 다음 server단에서 redirect 로 이동, 클라이언트에서 location.href 사용 등이 histroy에 남는다.

 

②페이지들에서의 ③페이지로 이동은 submit으로 form 전송을 한 뒤 redirect 했거나, 클라이언트에서 location.href 를 사용했을 것이다.

 

그렇다면 history에 남지 않고 페이지를 이동할 수 있을까 ?

 

클라이언트에서 location.replace() 를 사용하면 남지 않는다.

 

location.replace() 는 클라이언트에서 페이지를 이동시키는 함수이다. 그런 점에서 보면 location.href와 비슷하다고 생각 될 수 있는데 확실히 다르다.

 

 

href 와 replace 비교

	location.href	location.replace()
형태	속성	함수
기능	페이지 이동	페이지 교체
history	기록	기록하지 않음
임시파일	사용	사용하지 않음
사용방법	location.href = http://naver.com;	location.replace(http://naver.com);

 

 

location.replace() 는 history에 남지 않고 페이지를 이동하는 효과를 볼 수 있다.

 

그렇다면 location.href 는 location.replace() 로 대체할 수 있다.

 

 

 

다음으로 전송방식에 대해서 생각해본다.

 

submit 으로 form 전송 한 뒤에 서버에서 redirect 하는 방법 말고 다른 방법이 있는가?

 

비동기 ajax 방식이 존재한다.

 

비동기로 서버에 갔다가 특정 작업을 완료 한 후 다시 클라이언트로 돌아오는 방법이다.

 

클라이언트로 돌아왔기 때문에 redirect 가 아닌 location.href 또는 location.replace() 를 사용하여 페이지 전환을 해야 한다.

 

submit 은 ajax로 대체가 가능하다.

 

 

 

 

정리해본다.

 

먼저 ②페이지들에서 페이지를 이동하는 방식을 변경한다.

 

submit > redirect    >>> 변경 >>>    ajaxSubmit > location.replace()

또는

location.href    >>> 변경 >>>    location.replace()

 

다음과 같은 결과를 얻을 수 있다.

페이지 이동 : ①페이지 > ②페이지 > ③페이지

뒤로가기 이동 : ③페이지 > ①페이지

 

history를 삭제할 수는 없지만 history에 남기지 않는 방법으로 우회하여 해결 할 수는 있다.