[project] URL 접근 막기

📌

저희 조는 우여곡절 끝에 프로젝트 런칭을 이번주부터 시작했습니다!!
다행히 치명적인 오류는 없었지만 많은 피드백이 들어와서 수정중인데요 저는 입장시 기본 카메라 Off로 수정하는 부분과 게임방 URL로 직접 접근하는걸 막는 부분을 맡았습니다
백엔드분들과 상의중 문득 떠오른 방법으로 일단 구현을 했는데요 아마 수정이 필요할거 같습니다 ㅠㅠ...

 [createRoom.fulfilled]: (state, action) => {
      // console.log('action payload', action.payload.owner);
      sessionStorage.setItem('owner', action.payload.owner);
      sessionStorage.setItem('normalEnter', true);
      state.rooms.gameRoomResponseDtoList.push(action.payload);
      // 세션스토리지에 오너저장
      window.location.href = `/gameroom/${action.payload.roomId}`;
    },
    [createRoom.rejected]: (state, action) => {
      state.error = action.payload;
    },
    [enterRoom.fulfilled]: (state, action) => {
      // console.log(action.payload);
      sessionStorage.setItem('owner', action.payload.owner);
      sessionStorage.setItem('normalEnter', true);
      state.rooms = action.payload;
      window.location.href = `/gameroom/${action.payload.roomId}`;
    },

🔧roomslice 모듈의 일부 코드입니다! 게임방 입장과, 생성 후 세션스토리지에 normalEnter 라는 키값으로 true를 저장해줍니다

   if (!sessionStorage.getItem('normalEnter')) {
      console.log(sessionStorage.getItem('normalEnter'));
      alert('정상적인 접근이 아닙니다');
      navigate('/rooms');
    }

🔧게임방 페이지의 useEffect훅 안의 로직입니다 정상적으로 enterRoom과 createRoom을 통해서 방에 입장하지 않았다면 세션스토리지에 normalEnter 값이 없으므로 룸리스트 페이지로 사용자 페이지를 전환합니다

☝

해당 문제를 해결하기위해 제일 처음 생각했던 로직은 로그인 사용자는 쿠키에 토큰값을 가지고 있으므로 해당 토큰값의 유무로 로직을 작성하려 하였으나 로그인 한 유저가 URL 직접접근하여 방에 입장할 경우는 대처방법을 생각하지 못했기 때문에 위의 코드를 사용했습니다 ! 이후 수정되면 포스트 하겠습니다 :)