[Refactor] Axios Instance 구조 수정

src/api/core/auth/index.ts

@@ -0,0 +1,43 @@
+import axios from 'axios';
+
+import { getAccessToken } from '@/lib/auth/token';
+import { CommonErrorResponse } from '@/types/service/common';
+
+import { createApiHelper } from '../lib/apiHelper';
+
+const authInstance = axios.create({
+  baseURL: process.env.NEXT_PUBLIC_API_BASE_URL,
+  timeout: 20000,
+  withCredentials: true,
+});
+
+authInstance.interceptors.request.use(async (config) => {
+  const isServer = typeof window === 'undefined';
+
+  if (isServer) {
+    const { cookies } = await import('next/headers');
+    const cookieStore = await cookies();
+    const refreshToken = cookieStore.get('refreshToken')?.value;
+    if (refreshToken) {
+      config.headers.Cookie = `refreshToken=${refreshToken}`;
+    }
+  }
+
+  const accessToken = await getAccessToken();
+  if (accessToken && config.headers) {
+    config.headers.Authorization = `Bearer ${accessToken}`;
+  }
+
+  return config;
+});
+
+authInstance.interceptors.response.use(
+  (response) => {
+    return response;
+  },
+  async (error) => {
+    return new CommonErrorResponse(error.response?.data);
+  },
+);
+
+export const authAPI = createApiHelper(authInstance);

src/api/core/base/index.ts

@@ -0,0 +1,56 @@
+import axios from 'axios';
+
+import { getAccessToken } from '@/lib/auth/token';
+import { CommonErrorResponse } from '@/types/service/common';
+
+import { API } from '../..';
+import { createApiHelper } from '../lib/apiHelper';
+
+const baseInstance = axios.create({
+  baseURL: process.env.NEXT_PUBLIC_API_BASE_URL,
+  timeout: 20000,
+});
+
+baseInstance.interceptors.request.use(async (config) => {
+  const token = await getAccessToken();
+  if (token && config.headers) {
+    config.headers.Authorization = `Bearer ${token}`;
+  }
+  return config;
+});
+
+baseInstance.interceptors.response.use(
+  (response) => response,
+  async (error) => {
+    const isServer = typeof window === 'undefined';
+
+    const errorResponse = new CommonErrorResponse(error.response?.data);
+    const status = errorResponse.status;
+    const originalRequest = error.config;
+
+    if (status === 401 && !originalRequest._retry) {
+      originalRequest._retry = true;
+      try {
+        await API.authService.refresh();
+        return baseInstance(originalRequest);
+      } catch (refreshError) {
+        if (isServer) {
+          throw refreshError;
+        } else {
+          const currentPath = window.location.pathname + window.location.search;
+          window.location.href = `/login?error=unauthorized&path=${encodeURIComponent(currentPath)}`;
+        }
+      }
+    }
+    if (status === 404) {
+      if (isServer) {
+        const { notFound } = await import('next/navigation');
+        notFound();
+      }
+    }
+
+    throw errorResponse;
+  },
+);
+
+export const baseAPI = createApiHelper(baseInstance);

src/api/core/index.ts

@@ -1,124 +1,2 @@
-import axios from 'axios';
-
-import { CommonErrorResponse, CommonSuccessResponse } from '@/types/service/common';
-
-import { API } from '..';
-
-export const baseAPI = axios.create({
-  baseURL: process.env.NEXT_PUBLIC_API_BASE_URL,
-  timeout: 20000,
-});
-
-baseAPI.interceptors.request.use(async (config) => {
-  const isServer = typeof window === 'undefined';
-
-  if (isServer) {
-    // // Server 환경
-    const { cookies } = await import('next/headers');
-    const cookieStore = await cookies();
-    const token = cookieStore.get('accessToken')?.value;
-    if (token && config.headers) {
-      config.headers.Authorization = `Bearer ${token}`;
-    }
-  } else {
-    // Client 환경
-    const match = document.cookie.match(new RegExp('(^| )accessToken=([^;]+)'));
-    const token = match ? decodeURIComponent(match[2]) : undefined;
-    if (token && config.headers) {
-      config.headers.Authorization = `Bearer ${token}`;
-    }
-  }
-
-  return config;
-});
-
-baseAPI.interceptors.response.use(
-  (response) => {
-    return response;
-  },
-  async (error) => {
-    const errorResponse: CommonErrorResponse = error.response?.data || {
-      type: 'about:blank',
-      title: 'Network Error',
-      status: 0,
-      detail: '서버와 연결할 수 없습니다.',
-      instance: error.config?.url || '',
-      errorCode: 'NETWORK_ERROR',
-    };
-
-    const status = error.response?.status ?? errorResponse.status;
-    const isServer = typeof window === 'undefined';
-    const originalRequest = error.config;
-
-    // skipAuthRedirect flag가 지정되어있지 않으면 항상 redirect 되도록
-    if (originalRequest.skipAuthRedirect === undefined) {
-      originalRequest.skipAuthRedirect = true;
-    }
-
-    if (status === 401 && !originalRequest._retry) {
-      originalRequest._retry = true;
-      try {
-        // refresh - set cookie는 클라이언트 요청만 동작함
-        if (!isServer) {
-          await API.authService.refresh(originalRequest.skipAuthRedirect);
-        }
-        return baseAPI(originalRequest);
-      } catch (refreshError) {
-        if (!originalRequest.skipAuthRedirect) throw refreshError;
-        if (isServer) {
-          const { redirect } = await import('next/navigation');
-          redirect('/login');
-        } else {
-          if (window.location.pathname === '/login') {
-            throw errorResponse;
-          }
-          const currentPath = window.location.pathname + window.location.search;
-          window.location.href = `/login?error=unauthorized&path=${encodeURIComponent(currentPath)}`;
-        }
-      }
-    }
-    if (status === 404) {
-      if (isServer) {
-        const { notFound } = await import('next/navigation');
-        notFound();
-      }
-    }
-
-    throw errorResponse;
-  },
-);
-
-type ApiVersionType = 'v1' | 'v2';
-
-// 공통 응답 형식 처리를 위한 api 헬퍼
-const apiHelper = (v: ApiVersionType = 'v1') => ({
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  get: async <T>(url: string, config?: any): Promise<T> => {
-    const response = await baseAPI.get<CommonSuccessResponse<T>>(`/api/${v}${url}`, config);
-    return response.data.data;
-  },
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  post: async <T>(url: string, data?: any, config?: any): Promise<T> => {
-    const response = await baseAPI.post<CommonSuccessResponse<T>>(`/api/${v}${url}`, data, config);
-    return response.data.data;
-  },
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  put: async <T>(url: string, data?: any, config?: any): Promise<T> => {
-    const response = await baseAPI.put<CommonSuccessResponse<T>>(`/api/${v}${url}`, data, config);
-    return response.data.data;
-  },
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  delete: async <T>(url: string, config?: any): Promise<T> => {
-    const response = await baseAPI.delete<CommonSuccessResponse<T>>(`/api/${v}${url}`, config);
-    return response.data.data;
-  },
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  patch: async <T>(url: string, data?: any, config?: any): Promise<T> => {
-    const response = await baseAPI.patch<CommonSuccessResponse<T>>(`/api/${v}${url}`, data, config);
-    return response.data.data;
-  },
-});
-
-export const api = apiHelper('v1'); // breaking change 방지용
-export const apiV1 = apiHelper('v1');
-export const apiV2 = apiHelper('v2');
+export { authAPI } from './auth';
+export { baseAPI } from './base';

src/api/core/lib/apiHelper.ts

@@ -0,0 +1,26 @@
+import { AxiosInstance, AxiosRequestConfig } from 'axios';
+
+import { CommonSuccessResponse } from '@/types/service/common';
+
+export const createApiHelper = (axios: AxiosInstance) => ({
+  get: async <T>(url: string, config?: AxiosRequestConfig): Promise<T> => {
+    const response = await axios.get<CommonSuccessResponse<T>>(url, config);
+    return response.data.data;
+  },
+  post: async <T>(url: string, data?: unknown, config?: AxiosRequestConfig): Promise<T> => {
+    const response = await axios.post<CommonSuccessResponse<T>>(url, data, config);
+    return response.data.data;
+  },
+  put: async <T>(url: string, data?: unknown, config?: AxiosRequestConfig): Promise<T> => {
+    const response = await axios.put<CommonSuccessResponse<T>>(url, data, config);
+    return response.data.data;
+  },
+  delete: async <T>(url: string, config?: AxiosRequestConfig): Promise<T> => {
+    const response = await axios.delete<CommonSuccessResponse<T>>(url, config);
+    return response.data.data;
+  },
+  patch: async <T>(url: string, data?: unknown, config?: AxiosRequestConfig): Promise<T> => {
+    const response = await axios.patch<CommonSuccessResponse<T>>(url, data, config);
+    return response.data.data;
+  },
+});

src/api/service/auth-service/index.ts

@@ -1,4 +1,4 @@
-import { api } from '@/api/core';
+import { authAPI } from '@/api/core';
 import { clearAccessToken, setAccessToken } from '@/lib/auth/token';
 import {
   GoogleOAuthExchangeRequest,
@@ -13,47 +13,42 @@ import {
 export const authServiceRemote = () => ({
   // 로그인
   login: async (payload: LoginRequest) => {
-    const data = await api.post<LoginResponse>('/auth/login', payload, { withCredentials: true });
+    const data = await authAPI.post<LoginResponse>('/api/v1/auth/login', payload);
 
     setAccessToken(data.accessToken, data.expiresIn);
     return data;
   },
 
   // 회원가입
-  signup: (payload: SignupRequest) => api.post<SignupResponse>(`/auth/signup`, payload),
+  signup: async (payload: SignupRequest) => {
+    return authAPI.post<SignupResponse>(`/api/v1/auth/signup`, payload);
+  },
 
   // 로그아웃
   logout: async () => {
-    await api.post<void>('/auth/logout', null, { withCredentials: true });
+    await authAPI.post<void>('/api/v1/auth/logout', null);
     clearAccessToken();
   },
 
   // 액세스 토큰 재발급
-  refresh: async (redirect: boolean = true) => {
-    const data = await api.post<RefreshResponse>(
-      '/auth/refresh',
-      {},
-      { _retry: true, withCredentials: true, skipAuthRedirect: redirect },
-    );
-
+  refresh: async () => {
+    //prettier-ignore
+    const data = await authAPI.post<RefreshResponse>('/api/v1/auth/refresh', {});
     setAccessToken(data.accessToken, data.expiresIn);
     return data;
   },
 
   // 회원 탈퇴
   withdraw: async () => {
-    await api.delete<void>('/auth/withdraw', { withCredentials: true });
+    await authAPI.delete<void>('/api/v1/auth/withdraw');
     clearAccessToken();
   },
 
   // 구글 OAuth 코드 교환
   exchangeGoogleCode: async (payload: GoogleOAuthExchangeRequest) => {
-    const data = await api.post<GoogleOAuthExchangeResponse>('/auth/google', payload, {
-      withCredentials: true,
-    });
+    const data = await authAPI.post<GoogleOAuthExchangeResponse>('/api/v1/auth/google', payload);
 
     setAccessToken(data.accessToken, data.expiresIn);
-
     return data;
   },
 });

src/api/service/chat-service/index.ts

@@ -1,4 +1,4 @@
-import { apiV1 } from '@/api/core';
+import { baseAPI } from '@/api/core';
 import {
   ChattingRoom,
   CreateDMPayloads,
@@ -17,17 +17,17 @@ import {
 export const chatServiceRemote = () => ({
   // 채팅방 목록 조회
   getChatRooms: async () => {
-    return apiV1.get<GetChatRoomsResponse>('/chat/rooms');
+    return baseAPI.get<GetChatRoomsResponse>('/api/v1/chat/rooms');
   },
 
   // 1:1(DM) 채팅방 생성
   createDMChatRoom: async (payloads: CreateDMPayloads) => {
-    return apiV1.post<ChattingRoom>('/chat/dm', payloads);
+    return baseAPI.post<ChattingRoom>('/api/v1/chat/dm', payloads);
   },
 
   // 메세지 이력 조회
   getChatMessages: async ({ roomId, cursor, size }: GetChatMessagesParams) => {
-    return apiV1.get<GetChatMessagesResponse>(`/chat/rooms/${roomId}/messages`, {
+    return baseAPI.get<GetChatMessagesResponse>(`/api/v1/chat/rooms/${roomId}/messages`, {
       params: {
         cursor,
         size,
@@ -37,21 +37,21 @@ export const chatServiceRemote = () => ({
 
   // 메세지 읽음 처리
   readMessages: async ({ roomId }: ReadMessagesParams) => {
-    return apiV1.put<ReadMessagesResponse>(`/chat/rooms/${roomId}/read`);
+    return baseAPI.put<ReadMessagesResponse>(`/api/v1/chat/rooms/${roomId}/read`);
   },
 
   // 채팅방 상세 조회
   getChatRoom: async ({ roomId }: GetChatRoomParams) => {
-    return apiV1.get<getChatRoomResponse>(`/chat/rooms/${roomId}`);
+    return baseAPI.get<getChatRoomResponse>(`/api/v1/chat/rooms/${roomId}`);
   },
 
   // 참여자 목록 조회
   getParticipants: async ({ roomId }: GetParticipantsParams) => {
-    return apiV1.get<GetParticipantsResponse>(`/chat/rooms/${roomId}/participants`);
+    return baseAPI.get<GetParticipantsResponse>(`/api/v1/chat/rooms/${roomId}/participants`);
   },
 
   // 추방하기
   kickUser: async (roomId: number, payload: KickUserPayloads) => {
-    return apiV1.post(`/chat/rooms/${roomId}/kick`, payload);
+    return baseAPI.post(`/api/v1/chat/rooms/${roomId}/kick`, payload);
   },
 });