주소 경로에서 중복 파라미터 값 체크

nearworld·2023년 4월 4일
0

실무 문제 해결

목록 보기
1/1

회사 업무에서 경로 처리 문제에서 애를 먹고 있었다.
예를 들어, 커뮤니티 페이지가 있고 그 페이지에 여러 종류의 카테고리 메뉴가 있다고 가정하자.
이 여러 종류의 카테고리 메뉴는 각각 다른 게시판에 연결이 되어 있다.

/:group/:board/:id
소모임 카테고리
- 소모임 자유게시판 - /group/free
- 소모임 익명게시판 - /group/unknown
- 소모임 갤러리 - /group/gallery

위 소모임 카테고리에는 3개의 게시판이 할당되어 있고 각 3개의 게시판으로 가는 경로가 있다.
그런데 예외적인 케이스로 주소창에 /group/gallery/gallery라고 입력했다고 치자.

이 경우 params는 아래의 필드들을 가지게 된다.

{
  group: 'group',
  board: 'gallery',
  id: 'gallery'
}

/group/gallery가 주소에 포함되어 있으니 소모임 갤러리를 화면에 띄우자고 할 수 도 있겠지만 정확하게 주소는 /group/gallery/gallery라고 입력되었으므로 다른 주소라고 생각하는게 맞다고 생각했다.

그래서 게시판을 띄우지않고 Not Found페이지를 화면에 보여주는게 더 맞다고 생각했다.
그러면 위처럼 주소가 입력되었을 경우에 같은 경로가 중복되었는지 아닌지를 처리해주는 로직이 필요하다.
이걸 어떻게 처리할지 생각해보다가 든 하나의 해결책은 Set을 사용하는 것이었다.

const params = useParams();

const paramsValues = Object.values(params); // ['group', 'gallery', 'gallery']
const paramsValuesSet = new Set(paramsValues) // Set['group', 'gallery']

if (paramsValues.length !== paramsValuesSet.size) 
  console.log('중복 경로 값 포함');
profile
깃허브: https://github.com/nearworld

0개의 댓글