URL에 쿼리 파라미터로 상태값을 저장해야하는가?

메모용 글입니다.

 

글 개요

 지원하고자 하는 회사의 홈페이지를 구경하다 보니 기존 팀프로젝트에서 고민했던 프론트 라우터의 path가 이 곳에서는 어떻게 관리되고 있는지가 궁금하여 확인하던 도중 신기한 점이 있어 정리해보려고 한다.

 

 

 

생각했던 점

마이페이지에서 아래 navbar를 클릭하여 이동하던 도중 url path가 궁금했기에 마이픽으로 클릭하여 이동함.

 

 

마이픽은 인가 처리가 되어야 확인할 수 있는 페이지였고, 첫 front path의 end point가 auth 였음.

 

https://thisisdomain.com/auth/sign-in

 

그런데 이후 쿼리 파라미터로 다음과 같이 redirect와 preventGoBack 값을 받고 있는 것을 확인하게 됨.

 

https://www.hemekolab.com/auth/sign-in?redirect=%252Fmypage%252Flikes&preventGoBack=false

헤메코랩 - 하나만 사도 어디로든 무료배송

url 인코딩에 따라 아래처럼 바꿔보면

%252F -> /

 

redirect 값은 /mypage/likes 이다. 즉, auth 진행 후 보내야하는 페이지 path로 보인다.

 

preventGoBack 값은 auth의 경우와 같이 뒤로가기를 허용하면 안되는 경우에 사용하는 값 같다.

 

왜 이렇게 넘길까?

이걸 보고 생각이 들었던 점은 react 기반의 웹페이지인 것으로 아는데 이 또한 전역 상태로 관리가 안되는 것인가?

 

url path에 이렇게 추가하여 넘기는 것의 의미가 무엇일까?

 

먼저 들었던 생각은 사용자가 연속적인 웹페이지를 사용할 때는 상관이 없을 듯 하지만 세션이 끊어지거나 상태값이 사라진 상태에서 다시 중간 과정으로 접속했을 때 상태값이 사라져있다는 것이다. 이 경우 아마 default 값을 가질 것이고 사용자 경험상 좋지 않을 수 있다. 이 경우를 위해 url 에 추가할 수는 있을 것 같다.

 

다른 이유가 있는지 좀 찾아보았다.

 

SEO와 URL의 관계

백엔드 개발자다보니 SEO(Search Engine Optimization)를 알고는 있었지만 구체적으로 알지 못했었는데 이번 기회에 조금 더 알게 되어 좋은 기회인 것 같다.

 

URL에 정보를 담는 다는 것은 SEO에 영향이 있다고 한다.

 

URL 구조가 백엔드 개발자가 익숙한 URL 패턴 혹은 REST API 등과 같이 Resource를 받아오는 경우에는 URL 자체가 의미를 가지고 있지 않기 때문에 SEO, 최적화에 도움이 되지 않는다는 것이다. CMS(Contents Management System) 사이트에서 보통 이렇게 사용하게 되는데 이런 부분에 익숙했던 내가 이 부분에 대하여 인식하지 못했던 것 같다.

 

정리하자면 URL에 정보를 담는 것은 SEO에 긍정적인 영향을 줄 수 있다. 하지만 절대적 요소가 아니며 컨텐츠의 질과 관련성이 더 중요한 요소라고 한다.

 

그외 단점

다른 점들을 찾아보다보니 단점들도 확인할 수 있었는데 URL에 이런 상태 값을 넣을 경우 상태 관리 복잡도가 증가할 수 있다고 한다. 위에서 보았던 것처럼 적은 상태의 경우에는 문제가 안될 것 같으나 많은 상태를 파라미터로 관리할 경우 생기는 문제 점 같다.

 

이외에도 긴 URL이 사용자 경험을 저하시킬 수 있다고 하는데 장애인 사용자의 경우에 접근성이 떨어질 수 있다고 한다.(하지만, 이런 상ㅌ를 관리하는 경우 중간의 특정 페이지를 들어갈 일이 없을 것 같아 큰 문제가 생기는지는 잘 모르겠다.)

 

정리

우연히 보게 된 url path 덕분에 재밌게 공부할 수 있었던 것 같아 좋다.

 

다시 지원동기를 작성하러.. 가보려한다.