Refresh Token + Access Token 분리

import * as jwt from 'jsonwebtoken';

function generateTokens(userId: number) {
  const accessToken = jwt.sign(
    { id: userId },
    process.env.JWT_ACCESS_SECRET,
    { expiresIn: '1h' }
  );

  const refreshToken = jwt.sign(
    { id: userId },
    process.env.JWT_REFRESH_SECRET,
    { expiresIn: '14d' }
  );

  return { accessToken, refreshToken };
}

// 클라이언트
const response = await fetch('/api/posts', {
  headers: {
    Authorization: `Bearer ${accessToken}`
  }
});

// 클라이언트 — 401 응답 시 토큰 갱신
async function refreshAccessToken() {
  const response = await fetch('/api/auth/refresh', {
    method: 'POST',
    credentials: 'include'  // 쿠키 자동 포함
  });

  if (response.ok) {
    const { accessToken } = await response.json();
    return accessToken;
  }

  // Refresh Token도 만료 → 재로그인 필요
  redirectToLogin();
}

// 서버 — Refresh 엔드포인트
async refreshToken(userId: number, refreshToken: string) {
  // 1. Refresh Token 유효성 검증
  const payload = jwt.verify(refreshToken, process.env.JWT_REFRESH_SECRET);

  // 2. 저장된 Refresh Token과 비교 (선택적이지만 권장)
  const storedToken = await this.getStoredRefreshToken(payload.id);
  if (storedToken !== refreshToken) {
    throw new UnauthorizedException('유효하지 않은 토큰');
  }

  // 3. 새 Access Token 발급
  const newAccessToken = jwt.sign(
    { id: payload.id },
    process.env.JWT_ACCESS_SECRET,
    { expiresIn: '1h' }
  );

  return { accessToken: newAccessToken };
}

// ❌ 이렇게 하면 안 됨
localStorage.setItem('refreshToken', token);

// 서버에서 Refresh Token을 쿠키로 설정
response.cookie('refresh_token', refreshToken, {
  httpOnly: true,   // JavaScript에서 접근 불가
  secure: true,     // HTTPS에서만 전송
  sameSite: 'strict', // CSRF 방지
  path: '/api/auth',  // 인증 엔드포인트에서만 전송
  maxAge: 14 * 24 * 60 * 60 * 1000  // 14일
});

// Access Token은 메모리에 보관하고 명시적으로 헤더에 추가
let accessToken = null;

async function apiRequest(url, options = {}) {
  return fetch(url, {
    ...options,
    headers: {
      ...options.headers,
      Authorization: `Bearer ${accessToken}`
    }
  });
}

import { Injectable } from '@nestjs/common';
import { PassportStrategy } from '@nestjs/passport';
import { ExtractJwt, Strategy } from 'passport-jwt';

@Injectable()
export class AccessTokenStrategy extends PassportStrategy(Strategy, 'jwt') {
  constructor() {
    super({
      // Authorization: Bearer <token> 에서 추출
      jwtFromRequest: ExtractJwt.fromAuthHeaderAsBearerToken(),
      secretOrKey: process.env.JWT_ACCESS_SECRET,
    });
  }

  async validate(payload: { id: number }) {
    return payload;  // req.user에 할당됨
  }
}

import { Injectable } from '@nestjs/common';
import { PassportStrategy } from '@nestjs/passport';
import { Strategy } from 'passport-jwt';
import { Request } from 'express';

@Injectable()
export class RefreshTokenStrategy extends PassportStrategy(Strategy, 'jwt-refresh') {
  constructor() {
    super({
      // 쿠키에서 직접 추출하는 커스텀 extractor
      jwtFromRequest: (req: Request) => {
        return req.cookies?.['refresh_token'];
      },
      secretOrKey: process.env.JWT_REFRESH_SECRET,
      passReqToCallback: true,  // validate()에서 req 접근 가능
    });
  }

  async validate(req: Request, payload: { id: number }) {
    const refreshToken = req.cookies['refresh_token'];
    return { ...payload, refreshToken };
  }
}

import { AuthGuard } from '@nestjs/passport';

// Access Token 검증 Guard
export class JwtGuard extends AuthGuard('jwt') {}

// Refresh Token 검증 Guard  
export class RefreshJwtGuard extends AuthGuard('jwt-refresh') {}

@Controller('auth')
export class AuthController {
  // Access Token 필요한 일반 API
  @UseGuards(JwtGuard)
  @Get('profile')
  getProfile(@Req() req) {
    return req.user;
  }

  // Refresh Token으로 Access Token 재발급
  @UseGuards(RefreshJwtGuard)
  @Post('refresh')
  refresh(@Req() req) {
    const { id } = req.user;
    const newAccessToken = this.authService.generateAccessToken(id);
    return { accessToken: newAccessToken };
  }
}

// 로그아웃 시 현재 Access Token을 블랙리스트에 추가
async logout(accessToken: string) {
  // 토큰의 남은 유효기간만큼 블랙리스트에 저장
  const decoded = jwt.decode(accessToken) as { exp: number };
  const ttl = decoded.exp - Math.floor(Date.now() / 1000);

  if (ttl > 0) {
    await redis.set(`blacklist:${accessToken}`, 'true', 'EX', ttl);
  }
}

// Access Token Strategy에서 블랙리스트 체크
async validate(req: Request, payload: { id: number }) {
  const token = req.headers.authorization?.replace('Bearer ', '');

  const isBlacklisted = await redis.get(`blacklist:${token}`);
  if (isBlacklisted) {
    throw new UnauthorizedException('만료된 토큰');
  }

  return payload;
}

async refreshTokens(userId: number, oldRefreshToken: string) {
  // 1. 저장된 Refresh Token과 비교
  const stored = await redis.get(`refresh:${userId}`);
  if (stored !== oldRefreshToken) {
    // 이미 사용된 Refresh Token으로 요청 → 토큰 탈취 의심
    // 해당 사용자의 모든 토큰 무효화
    await redis.del(`refresh:${userId}`);
    throw new UnauthorizedException('토큰 재사용 감지');
  }

  // 2. 새 토큰 쌍 발급
  const newAccessToken = this.generateAccessToken(userId);
  const newRefreshToken = this.generateRefreshToken(userId);

  // 3. 새 Refresh Token 저장 (이전 것은 자동으로 덮어씀)
  await redis.set(`refresh:${userId}`, newRefreshToken, 'EX', 14 * 24 * 60 * 60);

  return { accessToken: newAccessToken, refreshToken: newRefreshToken };
}

import axios from 'axios';

const api = axios.create({
  baseURL: '/api',
  withCredentials: true  // 쿠키 포함
});

let accessToken: string | null = null;

// Request interceptor: Access Token 자동 추가
api.interceptors.request.use((config) => {
  if (accessToken) {
    config.headers.Authorization = `Bearer ${accessToken}`;
  }
  return config;
});

// Response interceptor: 401 시 토큰 갱신 후 재시도
api.interceptors.response.use(
  (response) => response,
  async (error) => {
    const originalRequest = error.config;

    // 401이고 아직 재시도하지 않은 요청만 처리
    if (error.response?.status === 401 && !originalRequest._retry) {
      originalRequest._retry = true;

      try {
        const { data } = await axios.post('/api/auth/refresh', null, {
          withCredentials: true
        });
        accessToken = data.accessToken;

        // 원래 요청을 새 토큰으로 재시도
        originalRequest.headers.Authorization = `Bearer ${accessToken}`;
        return api(originalRequest);
      } catch (refreshError) {
        // Refresh Token도 만료 → 로그인 페이지로
        accessToken = null;
        window.location.href = '/login';
        return Promise.reject(refreshError);
      }
    }

    return Promise.reject(error);
  }
);

let refreshPromise: Promise<string> | null = null;

async function getNewAccessToken() {
  if (!refreshPromise) {
    refreshPromise = axios.post('/api/auth/refresh', null, {
      withCredentials: true
    }).then(({ data }) => {
      accessToken = data.accessToken;
      return accessToken;
    }).finally(() => {
      refreshPromise = null;
    });
  }
  return refreshPromise;
}