• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

LocalStorage 값 변경 자동 체크

24.04.17 16:37 작성 24.04.17 16:45 수정 조회수 66

0

안녕하세요
스토어에서
LocalStorage 를 사용 하여 로그인 진행 중 막혀 문의 드립니다.
const accessToken = ref(localStorage.getItem('auth/access_token'))
또는
const accessToken = useLocalStorage('auth/access_token', null);
이렇게 선언하여

jwt토큰 값을 저장하고

토큰이 만료 되면 service 에서
리플래쉬 토큰으로 재발급하여 auth/access_token 에 다시 저장 하는데
isTokenValid 값이 변경이 되지 않습니다.

  const isTokenValid = computed(() => {  
    if (!accessToken.value) {
      console.log('No access token found.'); // Optionally log when no token is found.
      accessToken.value = null;
      return false;
    }
    const rtn_valuue = isTokenExpired(accessToken.value);
    if (!rtn_valuue) { // 토큰 만료
      accessToken.value = null;
    }
    return rtn_valuue;
  });


 useEventListener(window, 'local-storage', event => {
    if (event.key === 'auth/access_token') {
      console.log(
        'Detected changes in access token from another tab or window.:: local',
      );
      // 다른 탭에서 변경된 값으로 accessToken 업데이트
      accessToken.value = event.newValue;
    }
  });


이렇게 해도 체크가 안되네요

isTokenValid 값은 화면을 리로드 하면 바뀌는데
로컬 스토리지가 변경 되었을때는 변화가 없네요
해결 방안좀 부탁 드립니다.
감사합니다.

답변 1

답변을 작성해보세요.

0

안녕하세요

isTokenValid 값이 변경이 되지 않는다면 computed 내의 콜백 함수를 디버깅 해봐야 알 수 있는데요.

breakpoint를 활용해서 원하는 값의 변경이 잘 되는지 확인해 보시면 될 것 같습니다.