현재 로그아웃 로직을 다시한번 훑어보면서 리팩토링을 하다가 문제가 발생했었다. 로그아웃을 하고나서도 마이페이지로 들어가지는 것이여따.. 네트워크를 확인해보니까 어째서인지 쿠키에서 삭제되었어야할 'access' 토큰이 헤더에 쏘-옥 담겨서 잘 넘어가는 것이였는데, 이럴 수가 있나 싶었다.
음 내가 의심해볼만한건 router.push() 뿐이였다. 남아 있던 데이터를 기억하는 듯해보였기 때문이다. 그래서 router.push를 한번 읽어보았다. 그리고 찾다보니 window.location.href와 같이 특정 상황에서 바꿔가면서 쓰는 것을 확인하게 되었다.
그리고 나는 쿠키를 삭제하고 적용을 시켜야하니 새로고침이 한번 필요하다는 생각이 들었고, window.location.href를 적용시켜서 사용을 해보니까 잘 작동했다.
router.push가 애초에 useRouter라는 훅의 메소드인데 Refresh해주는 작업없이 그냥 페이지간 이동에 사용하면 되는 것 같다 대신 Refresh 작업을 안하고 또한 새로 다시 HTTP 요청을 안하는 것을 확인할 수 있었다.. 그리고 찾다보니 router.replace라는 메소드도 보게 되었는데, history에 안쌓이게 해주는 것 같다 그때 한가지가 스쳐지나갔는데, 그러면 내가 여태까지 뒤로 가기를 허용했다는 것을 깨닫고 머리를 쌔게 맞은 느낌이 났다. 최종적으로 아래처럼 고치게 되었고, 내가 원하는 동작이 잘 되는 것도 확인을 했다. refresh도 일어나고, history에 안쌓이는..
https://developer.mozilla.org/en-US/docs/Web/API/Window/location
Window.location - Web APIs | MDN
The Window.location read-only property returns a Location object with information about the current location of the document.
developer.mozilla.org
https://nextjs.org/docs/api-reference/next/router
next/router | Next.js
Learn more about the API of the Next.js Router, and access the router instance in your page with the useRouter hook.
nextjs.org
https://devbirdfeet.tistory.com/193
JavaScript - 페이지이동 location.href / location.replace() / location.assign()
주말의 끝을 맞아 오늘은, 페이지 이동할 때 숨쉬듯 사용하였던 내장 메소드들의 속성을 심층 비교하며 공부해보았다. 어느 날 열심히 일하다가 페이지 이동 관련하여 히스토리 이슈가 생겼었
devbirdfeet.tistory.com
'Project > 인코스런' 카테고리의 다른 글
| Next에서 fallback 이미지 처리하기 (0) | 2022.11.28 |
|---|---|
| 외부 링크 새탭으로 열어보자 (0) | 2022.11.22 |
| Pagination 전문가 React-Query... (0) | 2022.10.29 |
| 토스 결제창 연동하기 (0) | 2022.10.19 |
| Unable to preventDefault inside passive event listener invocation - 에러 (1) | 2022.10.19 |