[❗️Error] 12/16 (최우철) sameSite의 위력

[chltjdrhd777]

마주친 에러에 대한 설명

• 중간점검을 위해 팀원들과 함께 모두 통합을 한 뒤, 제대로 인증관련 시스템이 작동하는지를 확인하려고 테스트를 해보는 순간, 에러를 발생하면서 강제로 리턴하는 상황이 발생했다

  너는 권한이 없다고 저리가라는 슬픈 콘

  

• 해당 내용의 로그를 확인해본 결과, 로그인은 진행되었어도 쿠키가 전달받아지지 않는다는 사실을 알 수 있었다

  사용자가 마이페이지에 접근하려면, 쿠키에 있는 accessToken을 전달해야하는데, 애초에 엑세스 토큰을 받지 않았으므로 미리 설정했던 서버의 문구를 전달했던 것이다

  

---

해결하기 위한 노력과 방안

• 우선 명확하게 해야 할 것이, 내가 배포한 환경에는 쿠키를 전송할 때 오로지 "httpOnly" 옵션만 붙어서 가는 상황이었다
• 그러나, chrome기준, 현재 이곳은 쿠키 옵션이 없을 시에 자동으로 lax option을 붙어서 가게 되는데, 이 lax 옵션은 strict과 거의 비슷하게 same site가 아닐 경우에는 쿠키전송을 허락하질 않는다

sameSite란 public suffix(ex .com) 을 기준으로 한단계 더인 하위 도메인이 서로 일치하는지를 뜻하는 것이다

• 이 sameSite가 기본적으로 lax라는 소리는, 클라이언트와 서버가 서로 도메인명이 다르기때문에 필연적으로 쿠키가 전송되지 않을 것임을 의미했다

• 실제로 배포 후 모든 auth기능이 마비되는 것을 보고 이 옵션의 강력함을 느꼈고, 배포에 따른 환경조건에 따라 (ex, HTTPS_PORT 값이 환경변수에 있을 경우) 쿠키 옵션을 달리하도록 하여 유연성있게 변동하였다.

  

• 참고로 이렇게 옵션을 두고 나서 https형태로 들어가보면 쿠키값을 로컬에서때와같이는 볼 수가 없었는데

  로컬에서는 확인되는 쿠키

  

https 배포환경에서는 확인되지 않는 쿠키

-처음에는 왜 안보이는지 이해가 되질 않았으나, 차분하게 다시 생각해보니 https에서 저렇게 쿠키를 대놓고 볼 수 있다는 것은 쿠키에 접근도 용이하다는 소리인데 이것은 논리적으로도 맞지 않으므로 당연한 일이었다(;;)

• 많이 당황하였지만, 이 덕택에 쿠키에 대해서 조금 더 가까워지는 시간을 가질 수 있었다.

• 참고로, sameSite가 lax일 경우라도 특정 케이스라면 쿠키전송이 가능한데 이에 대한 표를 보면 보통 link와 a, 그리고 get에 해당하는 form 데이터 요청과 관련해서는 가능한 것을 볼 수 있다.

  

• 이게 필요한 이유는, 예를들어 쿠팡에서와 같은 사이트에서 내가 이 주소에서 무언가를 검색했을 경우 쿠키로 내 검색기록을 저장해두는데
• 이 저장내용은 만약 다른 사이트에서 내가 놀고있다가 특정 경로로 접근했을 때 그곳에 로 배너광고를 띄울 경우, 이 배너광고에 대한 내용을 결정하기 위해 href로 요청을 보낼 때, 그 주소와 연관된 쿠키값, 즉 내가 검색했던 기록을 함께 보내어 맞춤광고를 보내는 등의 ecommerce와 관련된 행위를 할 수 있도록 허용하기 위해서다.

실제로, 쿠팡에 무언가를 검색했을 경우 쿠키값으로 암호화된 값이 저장되는 것을 볼 수 있고, 이것을 디코드해보면 진짜로 내가 검색한 기록이 나온다!

레퍼런스

cookie options sameSite?