Single Flight 동시 요청 안전하게 처리하기

/**
 * 진행 중인 재발급 요청을 보관해서, 재발급이 동시에 두 번 나가지 않게 만드는 변수.
 *
 * 서버가 RT를 회전(rotate)시키면서 이전 RT를 즉시 무효화하기 때문에,
 * 재발급이 동시에 N개 나가면 첫 번째만 성공하고 나머지는 세션을 파괴한다.
 * 따라서 중복 제거는 최적화가 아니라 정확성 요건이다.
 */
let inflightReissue: Promise<boolean> | null = null;

export const requestReissue = (): Promise<boolean> => {
  if (inflightReissue) return inflightReissue;   // 이미 진행 중이면 그 요청에 합류한다

  inflightReissue = (async () => {
    try {
      const response = await fetch('/auth/reissue', {
        method: 'POST',
        // RT는 HttpOnly 쿠키이므로 브라우저가 자동으로 실어 보낸다.
        credentials: 'include',
      });
      if (!response.ok) return false;

      const body = await response.json().catch(() => null);
      if (!body?.accessToken) return false;

      // 새 AT를 저장한다 (쿠키, 메모리 등 프로젝트에 맞게 선택한다).
      saveAccessToken(body.accessToken, body.expiresIn);
      return true;
    } catch {
      return false;
    }
  })();

  // 성공하든 실패하든 변수를 비워서, 다음 만료 시점에 다시 갱신할 수 있게 한다.
  return inflightReissue.finally(() => {
    inflightReissue = null;
  });
};

export const fetchApi = async <T>(
  url: string,
  options: RequestInit = {},
  /** 재시도로 들어온 호출인지 여부. 401 → 재발급 → 재시도는 한 번만 수행한다. */
  isRetry = false,
): Promise<T> => {
  const token = getAccessToken();
  const response = await fetch(url, {
    ...options,
    headers: {
      ...options.headers,
      ...(token ? { Authorization: `Bearer ${token}` } : {}),
    },
  });

  // AT 만료(401) → RT로 갱신 → 원래 요청 재시도.
  if (
    response.status === 401 &&
    !isRetry &&                          // 1. 재시도는 1회만 수행한다
    url !== '/auth/reissue' &&           // 2. 재발급 요청 자신은 제외한다
    typeof document !== 'undefined'      // 3. SSR 환경에서는 시도하지 않는다
  ) {
    if (await requestReissue()) {
      return fetchApi<T>(url, options, true);
    }
    redirectToLogin();
  }

  if (!response.ok) throw new ApiError(response);
  return response.json() as Promise<T>;
};

// Next.js middleware.ts
const isExpiringSoon = !!refreshToken && (!accessToken || isAccessTokenExpiring(accessToken));

if (isExpiringSoon) {
  const result = await reissueOnServer(refreshToken);
  if (result.ok) {
    // 새 AT와 RT를 응답 헤더에 설정해서 다음 요청에 자동으로 적용되게 한다.
    return attachTokensToResponse(result);
  }
}