Construí um gerador de playlists no Spotify com Claude

Context

Spotify OAuth 인증을 localhost 환경에서 구현할 때 NextAuth v5가 127.0.0.1을 다시 localhost로 정규화하면서 redirect URI 검증 실패가 발생했다. 이는 NextRequest 생성자의 내부 동작으로 인한 것이며, reqWithEnvURL 유틸리티도 같은 문제를 반복해서 재현했다. OAuth의 두 단계(인증 요청과 토큰 교환)에서 redirect URI가 일관되지 않으면 invalid_grant 에러가 발생했다.

Technical Solution

• 네이티브 Request 객체 직접 사용: NextRequest 대신 브라우저/Node.js 네이티브 Request 객체를 사용해 URL 정규화 회피
• buildRequest 함수로 URL 수정: AUTH_URL 환경변수로 authOrigin을 명시하고 req.url의 호스트 부분을 127.0.0.1로 교체
• Auth() 함수 직접 호출: NextAuth의 route handler를 우회하고 @auth/core의 Auth() 함수에 수정된 Request를 직접 전달
• @auth/core 버전 고정: next-auth가 내부적으로 사용하는 @auth/core 버전과 정확히 일치시켜 설치하여 타입 충돌 방지
• auth.ts에서 명시적 설정: trustHost, basePath, secret, redirect_uri를 직접 구성해 setEnvDefaults 미실행 상황 보완
• next.config.mjs에서 localhost 리다이렉트: 전체 트래픽을 localhost에서 127.0.0.1로 리다이렉트해 PKCE 쿠키 도메인 스코핑 문제 해결
• SSE(Server-Sent Events)와 text/event-stream으로 스트리밍 구현: Promise.all과 emit-on-resolve 패턴으로 병렬 처리 후 UI 점진적 업데이트
• Claude API 응답 검증: JSON 파싱 시 hallucination 방지를 위해 모델의 형식 정확성에 의존

Impact

아티클에 정량적 수치가 명시되지 않음.

Key Takeaway

Next.js + OAuth 환경에서 localhost 개발 시 NextRequest의 내부 URL 정규화는 문서화되지 않은 동작이므로, 문제 발생 시 프레임워크 소스코드를 추적해야 하며, 제공되는 유틸리티(reqWithEnvURL)도 같은 정규화 문제를 가질 수 있다는 점을 인식해야 한다. NextAuth v5 베타 단계에서는 공식 문서 부족으로 인해 @auth/core 코드 분석이 필수적이다.