BFF + Server-Only JWT 인증 구조 전환

NextAuth 설정

// src/app/api/auth/auth-options.ts
import type { NextAuthOptions } from 'next-auth'

export const authOptions: Omit<NextAuthOptions, 'providers'> = {
  callbacks: {
    async jwt({ token, user }) {
      if (user) {
        token.accessToken = user.token  // 백엔드 토큰 → JWT에 저장
      }
      return token
    },
    async redirect({ url, baseUrl }) {
      if (url.startsWith('/')) return `${baseUrl}${url}`
      if (new URL(url).origin === baseUrl) return url
      return baseUrl
    },
    // session callback 없음 — 클라이언트에 세션 데이터 노출하지 않음
  },
  pages: { signIn: '/signin', signOut: '/', error: '/', verifyRequest: '/' },
  session: {
    strategy: 'jwt',
    maxAge: 365 * 24 * 60 * 60,  // 1년 — 백엔드 accessToken 만료 정책과 동일
  },
  secret: process.env.NEXTAUTH_SECRET,
}

주요 설계 결정

BFF 프록시

// src/app/api/bff/[...path]/route.ts
import { type NextRequest, NextResponse } from 'next/server'
import { getToken } from 'next-auth/jwt'

const API_BASE_URL = process.env.API_BASE_URL
if (!API_BASE_URL) throw new Error('API_BASE_URL environment variable is required')

async function proxyRequest(
  req: NextRequest,
  { params }: { params: Promise<{ path: string[] }> }
) {
  const { path } = await params
  const token = await getToken({ req, secret: process.env.NEXTAUTH_SECRET })

  if (!token?.accessToken) {
    return NextResponse.json({ message: 'Unauthorized' }, { status: 401 })
  }

  const backendPath = path.join('/')
  const url = new URL(`/${backendPath}`, API_BASE_URL)
  url.search = req.nextUrl.search

  const headers = new Headers()
  headers.set('Authorization', `Bearer ${token.accessToken}`)

  // 필요한 헤더만 선별 전달
  const contentType = req.headers.get('content-type')
  if (contentType) headers.set('Content-Type', contentType)
  const accept = req.headers.get('accept')
  if (accept) headers.set('Accept', accept)
  const acceptLanguage = req.headers.get('accept-language')
  if (acceptLanguage) headers.set('Accept-Language', acceptLanguage)
  const contentLength = req.headers.get('content-length')
  if (contentLength) headers.set('Content-Length', contentLength)

  let body: BodyInit | null = null
  if (req.method !== 'GET' && req.method !== 'HEAD') {
    body = req.body  // ReadableStream 스트리밍 전달
  }

  try {
    const response = await fetch(url.toString(), {
      method: req.method, headers, body,
      // @ts-expect-error — Node.js fetch ReadableStream body 전달 시 필요
      duplex: 'half',
    })
    const responseHeaders = new Headers(response.headers)
    responseHeaders.delete('transfer-encoding')
    return new Response(response.body, {
      status: response.status, headers: responseHeaders,
    })
  } catch (error) {
    console.error('[BFF] Backend request failed:', error)
    return NextResponse.json({ message: 'Backend unavailable' }, { status: 502 })
  }
}

export const GET = proxyRequest
export const POST = proxyRequest
export const PATCH = proxyRequest
export const PUT = proxyRequest
export const DELETE = proxyRequest

왜 getToken()인가 (getServerSession이 아닌 이유)

Middleware

// src/middleware.ts
import type { NextRequest } from 'next/server'
import { NextResponse } from 'next/server'
import { getToken } from 'next-auth/jwt'

// -- Role enum (백엔드 정의 기준) --
// type TRole = 'ROLE_ADMIN' | 'ROLE_MEMBER' | 'ROLE_FINANCE'

export async function middleware(req: NextRequest) {
  const { origin, pathname } = req.nextUrl

  const token = await getToken({
    req, secret: process.env.NEXTAUTH_SECRET,
  })

  const isLoggedIn = !!token?.accessToken
  const isPublicPath = pathname === '/signin' || pathname.startsWith('/upload/')

  // 로그인 상태에서 /signin 접근 → 메인으로
  if (isLoggedIn && pathname === '/signin') {
    return NextResponse.redirect(`${origin}/`)
  }

  // 공개 경로 통과
  if (isPublicPath) return NextResponse.next()

  // 미인증 → /signin (callbackUrl 포함)
  if (!isLoggedIn) {
    const callbackParam = pathname === '/' ? '' : `?callbackUrl=${pathname}`
    return NextResponse.redirect(`${origin}/signin${callbackParam}`)
  }

  // TODO: /settings/members 역할 기반 인가 체크
  // 백엔드 JWT에 role claim이 추가되면 활성화
  // if (pathname === '/settings/members') {
  //   const role = token.role as TRole | undefined
  //   if (role !== 'ROLE_ADMIN') {
  //     return NextResponse.redirect(`${origin}/`)
  //   }
  // }

  return NextResponse.next()
}

export const config = {
  matcher: ['/((?!api|assets|_next/static|_next/image|favicon.ico).*)'],
}

삭제된 코드

커밋 목록 (총 37+ 파일)

미인증 접근 차단

• 로그아웃 상태에서 /contact/buyers 직접 접속 → /signin?callbackUrl=/contact/buyers
• 로그아웃 상태에서 / 직접 접속 → /signin (callbackUrl 없이)
• 공개 경로 /upload/*는 미인증에서도 접근 가능

callbackUrl 복귀

• /signin?callbackUrl=/inventory 상태에서 로그인 → /inventory로 복귀
• 복귀 후 데이터 정상 로딩 (캐싱 문제 없이 첫 요청 정상 통과)

토큰/쿠키 검증

• DevTools → Application → Cookies: next-auth.session-token이 httpOnly 플래그
• DevTools → Console: document.cookie에 session-token 미출력
• DevTools → Network: 브라우저 요청에 Authorization: Bearer 헤더 없음
• DevTools → Network: 요청 URL이 /api/bff/* 경유

로그아웃 / 세션 만료

• 로그아웃 → /signin 리다이렉트 + 쿠키 삭제
• DevTools에서 next-auth.session-token 쿠키 수동 삭제 → 새로고침 → /signin 리다이렉트
• 로그아웃 후 보호된 페이지 뒤로가기 → /signin으로 다시 리다이렉트

401 응답 처리

• 백엔드 토큰 만료/무효화 시 → API 응답 401 → /signin?refresh=true 리다이렉트
• 리다이렉트 후 재로그인 → 정상 동작 (이전 401 상태 미캐싱)

BFF 프록시

• GET 요청: 바이어 목록, 재고 목록 정상
• POST 요청: 재고 생성, 이메일 발송 정상
• PATCH 요청: 바이어/재고 수정 정상
• DELETE 요청: 메모 삭제 등 정상
• 파일 업로드 (multipart): 재고 이미지 업로드 정상

새로고침 / SSR 안정성

• 로그인 후 아무 페이지에서 F5 → 세션 유지 + 데이터 정상 로딩
• SSR "Invalid URL" 에러 미발생 (Console 확인)
• 새 탭에서 동일 URL 접속 → 로그인 유지