[feat] refresh token 기반 토큰 재발급

src/apis/auth.ts

@@ -1,5 +1,6 @@
 import axios from 'axios';
 
+import { localstorageKeys } from '@src/constants/localstorage';
 import { Onboarding } from '@src/pages/onboarding/index.page';
 
 import { BaseResponse } from '.';
@@ -54,3 +55,23 @@ export const checkNickName = async (nickName: string) => {
 
   return res.data.data;
 };
+
+export type RefreshTokenResponse = BaseResponse<Auth['jwtTokens']>;
+export const refreshToken = async () => {
+  const user = localStorage.getItem(localstorageKeys.user);
+  if (!user) return;
+  const { refreshToken } = JSON.parse(user) as Auth['jwtTokens'];
+  if (!refreshToken) return;
+
+  const res = await axios.post<RefreshTokenResponse>(`/refresh`, null, {
+    headers: {
+      'refresh-token': refreshToken,
+    },
+  });
+  const code = res.data.code;
+  if (Number(code) === 2003 || Number(code) === 2005 || Number(code) === 2006) {
+    localStorage.removeItem(localstorageKeys.user);
+  }
+
+  return res.data.data;
+};

src/configs/axios.ts

@@ -1,6 +1,6 @@
 import axios, { AxiosRequestConfig } from 'axios';
 
-import { Auth } from '@src/apis';
+import { Auth, refreshToken } from '@src/apis';
 import { localstorageKeys } from '@src/constants/localstorage';
 
 export const BASE_URL = process.env.NEXT_PUBLIC_API_URL;
@@ -22,4 +22,26 @@ export const interceptorsAxiosConfig = () => {
     }
     return config;
   });
+
+  axios.interceptors.response.use(
+    (res) => res,
+    async (err) => {
+      const { config, response } = err;
+      const code = response.data.code;
+
+      if (Number(code) !== 2002) {
+        return Promise.reject(err);
+      }
+
+      config.sent = true;
+      const jwtTokens = await refreshToken();
+      if (!jwtTokens) {
+        localStorage.removeItem(localstorageKeys.user);
+        return Promise.reject(err);
+      }
+      localStorage.setItem(localstorageKeys.user, JSON.stringify(jwtTokens));
+
+      return axios(config);
+    },
+  );
 };