JWT 기반 Permission 분리로 DB 쿼리 zero 및 Next.js 16 proxy.ts 최적화 구현

Context

사용자 권한 확인을 위한 DB Round-trip 발생으로 인한 레이턴시 증가 및 데이터 레이어와 권한 로직의 강한 결합 문제 발생. Next.js 16의 최신 네트워크 경계 설정 및 서버 컴포넌트 구조에 최적화된 권한 제어 아키텍처 필요.

Technical Solution

• DB 쿼리 제거를 위해 JWT 내에 Role과 Permission 세트를 포함시켜 stateless한 권한 검증 구조 설계
• Role(관리 추상화)과 Permission(최소 단위 기능)을 분리하여 코드 수정 없이 대시보드 설정만으로 권한 변경이 가능한 Decoupling 전략 채택
• middleware.ts를 대체하는 Next.js 16의 proxy.ts를 활용하여 네트워크 경계에서 인증 및 리다이렉션을 처리하는 효율적 게이트웨이 구성
• React Server Components 내에서 세션 기반의 동기적 Permission 체크를 수행하여 데이터 워터폴(Waterfall) 현상 방지
• use cache 지시어의 공유 특성을 고려하여 권한 민감 컴포넌트를 캐시 경계 외부에 배치하는 보안 렌더링 전략 적용
• PermissionGate 컴포넌트 추상화를 통한 UI 수준의 조건부 렌더링 로직 일원화