OAuth 2.1 변경점과 실무 적용 가이드 — PKCE 필수화와 보안 강화

OAuth 2.0 → 2.1 핵심 변경점 5가지

PKCE 동작 원리와 Node.js 구현

PKCE code_verifier / code_challenge 생성 (Node.js)
import crypto from 'crypto'

// code_verifier: 43~128자 랜덤 문자열 (URL-safe base64)
function generateCodeVerifier(): string {
  return crypto.randomBytes(32).toString('base64url')
}

// code_challenge: code_verifier의 SHA-256 해시를 base64url 인코딩
function generateCodeChallenge(verifier: string): string {
  return crypto
    .createHash('sha256')
    .update(verifier)
    .digest('base64url')
}

const codeVerifier = generateCodeVerifier()
const codeChallenge = generateCodeChallenge(codeVerifier)

console.log('verifier:', codeVerifier)
console.log('challenge:', codeChallenge)

Authorization 요청 URL 생성 (Express)
import express from 'express'
import crypto from 'crypto'

const app = express()
app.use(express.json())
// 세션 또는 서버사이드 스토어에 verifier 저장 필요
const store = new Map<string, string>()

app.get('/auth/login', (req, res) => {
  const codeVerifier = crypto.randomBytes(32).toString('base64url')
  const codeChallenge = crypto.createHash('sha256').update(codeVerifier).digest('base64url')
  const state = crypto.randomBytes(16).toString('hex')

  // state를 키로 verifier 임시 저장 (Redis 등 외부 스토어 권장)
  store.set(state, codeVerifier)

  const params = new URLSearchParams({
    response_type: 'code',
    client_id: process.env.CLIENT_ID ?? '',
    redirect_uri: 'https://yourapp.com/auth/callback',
    scope: 'openid profile email',
    state,
    code_challenge: codeChallenge,
    code_challenge_method: 'S256',
  })

  res.redirect(`https://auth.example.com/authorize?${params.toString()}`)
})

Token 교환 — Callback 핸들러
app.get('/auth/callback', async (req, res) => {
  const { code, state } = req.query as { code: string; state: string }

  const codeVerifier = store.get(state)
  if (!codeVerifier) {
    return res.status(400).json({ error: 'invalid_state' })
  }
  store.delete(state)

  const tokenRes = await fetch('https://auth.example.com/token', {
    method: 'POST',
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
    body: new URLSearchParams({
      grant_type: 'authorization_code',
      code,
      redirect_uri: 'https://yourapp.com/auth/callback',
      client_id: process.env.CLIENT_ID ?? '',
      code_verifier: codeVerifier,
    }),
  })

  const tokens = await tokenRes.json()
  // Access Token을 httpOnly 쿠키로 저장 (localStorage 금지)
  res.cookie('access_token', tokens.access_token, {
    httpOnly: true,
    secure: true,
    sameSite: 'lax',
    maxAge: tokens.expires_in * 1000,
  })
  res.redirect('/dashboard')
})

Refresh Token Rotation — 구현 패턴과 재사용 감지

Refresh Token Rotation 서버 구현 (Node.js + 의사코드)
// Token 갱신 엔드포인트
app.post('/auth/refresh', async (req, res) => {
  const { refresh_token } = req.body

  // DB에서 refresh token 조회
  const tokenRecord = await db.refreshTokens.findOne({ token: refresh_token })

  if (!tokenRecord) {
    // 존재하지 않는 토큰 — 이미 사용됐거나 위조된 토큰
    // 해당 family의 모든 세션 무효화 (Refresh Token Family 패턴)
    const userId = await db.refreshTokens.findUserByFamily(refresh_token)
    if (userId) await db.refreshTokens.revokeAllByUser(userId)
    return res.status(401).json({ error: 'token_reuse_detected' })
  }

  if (tokenRecord.expiresAt < new Date()) {
    await db.refreshTokens.delete({ token: refresh_token })
    return res.status(401).json({ error: 'token_expired' })
  }

  // Rotation: 기존 토큰 삭제 후 새 토큰 발급
  const newRefreshToken = crypto.randomBytes(32).toString('base64url')
  await db.refreshTokens.delete({ token: refresh_token })
  await db.refreshTokens.create({
    token: newRefreshToken,
    userId: tokenRecord.userId,
    family: tokenRecord.family, // family ID로 재사용 탐지
    expiresAt: new Date(Date.now() + 30 * 24 * 60 * 60 * 1000),
  })

  const newAccessToken = issueAccessToken(tokenRecord.userId)
  res.json({ access_token: newAccessToken, refresh_token: newRefreshToken })
})

보안 체크리스트와 흔한 실수 5가지

Redirect URI 서버 사이드 검증
const ALLOWED_REDIRECT_URIS = new Set([
  'https://yourapp.com/auth/callback',
  'https://staging.yourapp.com/auth/callback',
])

function validateRedirectUri(uri: string): boolean {
  // 완전 일치만 허용 — URL 파싱 후 비교하여 경로 조작 방지
  try {
    const parsed = new URL(uri)
    const normalized = `${parsed.origin}${parsed.pathname}`
    return ALLOWED_REDIRECT_URIS.has(normalized)
  } catch {
    return false
  }
}

// Authorization 요청 처리 시
app.get('/authorize', (req, res) => {
  const { redirect_uri } = req.query as { redirect_uri: string }
  if (!validateRedirectUri(redirect_uri)) {
    return res.status(400).json({ error: 'invalid_redirect_uri' })
  }
  // 이후 처리...
})