개발자

Javascript 에서 setTimeout으로 redirect 후 뒤로가기 했을때 이전 페이지가 아닌 전 전 페이지로 돌아가는 이유

2023년 06월 09일조회 341

크롬 브라우저에서 스크립트 setTimeout으로 이동 후에 이동 된 페이지에서 브라우저 뒤로가기 버튼을 누르면 이전 페이지가 아니라 그 전 페이지로 이동 되는 문제가 있는데 어떻게 해결 할 수 있을까요? 현재 a, b, c html 3개 파일이 있고 a는 누르면 b로 이동하는 버튼 하나를 가지고 있습니다. b는 아무 동작 없이 setTimeout으로 cl로 이동합니다. c는 아무 코드가 없고 코드를 작성할 수 없습니다. a에서 버튼을 눌러서 b로 location.href 로 이동 후 b에서 setTimeout(() => {location.replace('c.html')}, 5000) 으로 c로 이동 한 뒤 c 에서 뒤로가기를 하면 b가 아닌 a로 이동 됩니다. (b에서 유저가 클릭이나 다른 액션을 하면 c에서 뒤로가기 시 b로 오지만 아무런 액션이 없을 때 a로 돌아갑니다.) c를 수정할 수 없을 떄 b를 수정해서 이 이슈를 해결하는 방법이 있을까요? stackoverflow (https://stackoverflow.com/questions/76197884/after-redirect-from-settimeout-chrome-edge-back-button-doesnt-work-well) 에도 비슷한 이슈가 있는데 여기도 해결된 답은 없어서 여기에 질문을 남겨봅니다.

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.
profile picture
익명님의 질문

답변 1

김현진님의 프로필 사진

b에서 location.replace를 사용하여 페이지 이동을 했기 때문입니다. 페이지 스택이 a->b->c로 쌓인게 아니라 a->c로 쌓여있기 때문에 c에서 뒤로갈 경우 a 페이지로 이동하게 됩니다. b에서도 location.href를 사용하시면 원하는 대로 동작할 듯 합니다.

profile picture

익명

작성자

2023년 06월 09일

우선 답변 감사합니다. location.href 도 같은 이슈가 있습니다. 처음 문제를 받았을 때 location.href로 되어있던 코드였는데 제가 이것저것 바꿔보다 replace로 바꾼 상태의 코드로 질문을 하게 됐습니다.

김현진님의 프로필 사진

김현진

퍼블리 소프트웨어엔지니어2023년 06월 09일

스택이 제대로 쌓이 않는 걸까요... 올려주신 스택오버플로우 링크의 내용들은 이미 시도해보신거죠? (pushState - https://developer.mozilla.org/en-US/docs/Web/API/History/pushState)

NickSoon님의 프로필 사진

NickSoon

스타트업 개발자2023년 06월 09일

PHP에서 개발을 할 경우에도 이런 상황이 많은데 크롬이나 엣지에서 사용자의 동작이 없이 다음 페이지로 넘어갈 경우 캐싱이 되지 않아 페이지에서 이전이 아닌 전전으로 넘어간 것 아닐까요?

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

목록으로

지금 가입하면 모든 질문의 답변을 볼 수 있어요!