한국어
  • cookie
  • nextjs
  • serverless

쿠키 크기 초과 오류를 쿠키 분할로 해결하는 방법

쿠키 크기 초과 오류에 대한 해결책: 쿠키를 여러 작은 쿠키로 나누고 서버 측에서 이를 재구성합니다. 이 솔루션은 추가 인프라가 필요 없는 서버리스 플랫폼에서 특히 잘 작동합니다.

Sijie
Sijie
Developer

요약: 쿠키 크기가 4KB 브라우저 한도를 초과할 때, 이를 여러 작은 쿠키로 나누고 서버 측에서 재구성하세요. 이 솔루션은 추가 인프라가 필요 없는 서버리스 플랫폼에서 특히 잘 작동합니다.

Logto SDK 에서의 쿠키 사용

기존 웹 앱을 위한 대부분의 Logto SDK 에서 우리는 보안을 위해 HTTP 전용 쿠키에 세션 데이터를 저장합니다. 우리의 접근 방식은 다음과 같습니다:

SDK 가 세션 데이터가 필요한 작업을 수행하면:

  • 대칭 암호화를 사용하여 암호화합니다.
  • 암호화된 문자열을 HTTP 전용 쿠키에 저장합니다.
  • HTTPS 전용 전송을 보장하기 위해 보안 플래그를 설정합니다.

이 접근 방식은 외부 스토리지가 필요 없으며, 인기 있는 서버리스 플랫폼인 Vercel 에 추가 인프라 변경 없이 직접 배포할 수 있습니다.

문제: 쿠키 크기 초과 오류

그러나 다중 조직 지원을 구현할 때 우리는 한계에 부딪혔습니다. 각종 쿠키에 저장해야 하는 데이터들 때문에 쿠키 크기가 4KB 브라우저 한도를 초과했기 때문입니다:

  • 로그인 및 기타 세션 데이터
  • 사용자 인증을 위한 ID 토큰
  • 새로 고침 토큰
  • 다른 자원 지표가 있는 접근 토큰
  • 여러 조직이 동시에 활성화되는 경우, 페이로드가 포함된 JWT 조직 토큰 (조직별 1개)이 매우 클 수 있습니다.

이로 인해 오류가 발생했습니다:

브라우저는 엄격한 쿠키 크기 제한을 시행하며, 대부분은 개별 쿠키를 4KB 로 제한하고 도메인당 총 쿠키 크기를 8KB 로 제한합니다.

외부 스토리지 사용은 어떨까요?

Redis 나 데이터베이스와 같은 외부 스토리지를 사용하면 SDK 사용자에게 추가 인프라 설정이 필요하여 비용과 복잡성이 증가합니다. 이는 개발자 친화적 솔루션을 제공하기 위한 우리의 목표에 반합니다.

인메모리 스토리지가 대안일 수 있지만, 인스턴스가 일시적이고 메모리가 요청 간에 공유되지 않는 서버리스 환경에서는 잘 작동하지 않습니다.

해결책: 쿠키 분할

간단한 해결책은 큰 쿠키를 더 작은 조각으로 나누는 것입니다. 이 글은 Next.js 를 예로 사용하여 접근 방식을 설명합니다:

1. 세션 데이터 분할

2. 조각 저장

3. 요청 시 재구성

구현을 위한 모범 사례

1. 조각 크기 관리

2. 세션 관리 정리

총 쿠키 크기 모니터링:

결론

쿠키 분할은 구현하기 쉽고 기존 응용 프로그램 아키텍처에 최소한의 방해를 주는 우아한 솔루션을 제공합니다. 개발자는 큰 쿠키를 작은 조각으로 나누기만 하면 브라우저 크기 제한을 극복할 수 있으며, 핵심 세션 관리 접근 방식을 변경하거나 외부 종속성을 추가할 필요가 없습니다.