diff --git a/src/apis/error/throwAxiosError.ts b/src/apis/error/throwAxiosError.ts index 27a45432..efd8dbbe 100644 --- a/src/apis/error/throwAxiosError.ts +++ b/src/apis/error/throwAxiosError.ts @@ -1,5 +1,4 @@ import { isAxiosError } from "axios"; -import { toast } from "react-toastify"; const throwAxiosError = (err: unknown) => { if (!isAxiosError(err)) @@ -12,7 +11,6 @@ const throwAxiosError = (err: unknown) => { const data = err?.response?.data; const { code, status, message } = data; console.log(err); - toast.error("오류가 발생했습니다."); return { code, status, message }; }; diff --git a/src/apis/httpClient/httpClient.ts b/src/apis/httpClient/httpClient.ts index 1bd693af..fe66e3a2 100644 --- a/src/apis/httpClient/httpClient.ts +++ b/src/apis/httpClient/httpClient.ts @@ -1,8 +1,8 @@ import axios, { AxiosInstance, AxiosRequestConfig } from "axios"; import { requestInterceptors, responseInterceptors } from "@/apis/interceptor"; -import { KEY, TOKEN } from "@/constants/"; -import { QueryClient } from "@tanstack/react-query"; +import { ERROR, TOKEN } from "@/constants/"; import Storage from "../storage"; +import { refresh } from "../token"; export interface HttpClientConfig { baseURL?: string; @@ -132,16 +132,15 @@ export class HttpClient { private setting() { HttpClient.setCommonInterceptors(this.api); - const queryClient = new QueryClient(); this.api.interceptors.response.use( (response) => response, - (error) => { - queryClient.invalidateQueries([ - KEY.USER, - Storage.getItem(TOKEN.ACCESS), - ]); - return Promise.reject(error); + async (error) => { + const originalRequest = error.config; + if (error.response.data.code === ERROR.CODE.TOKEN_403_2) { + await refresh(); + return this.api(originalRequest); + } }, ); } @@ -164,7 +163,6 @@ export default { post: new HttpClient("api/post/", axiosConfig), recomment: new HttpClient("api/recomment", axiosConfig), comment: new HttpClient("api/comment", axiosConfig), - refresh: new HttpClient("api/auth/refresh/access", axiosConfig), auth: new HttpClient("api/auth/", axiosConfig), bamboo: new HttpClient("api/bamboo", axiosConfig), admin: new HttpClient("api/bamboo/admin", axiosConfig), diff --git a/src/apis/token/refresh.ts b/src/apis/token/refresh.ts index f0f9971f..e0ca70c0 100644 --- a/src/apis/token/refresh.ts +++ b/src/apis/token/refresh.ts @@ -1,10 +1,14 @@ import { TOKEN } from "@/constants/"; import Storage from "@/apis/storage"; -import httpClient from "../httpClient"; +import axios from "axios"; + +const instance = axios.create({ + baseURL: process.env.NEXT_PUBLIC_BASE_URL, +}); const refresh = async () => { try { - const { data } = await httpClient.refresh.put({ + const { data } = await instance.put("/api/auth/refresh/access", { refreshToken: `${Storage.getItem(TOKEN.REFRESH)}`, }); Storage.setItem(TOKEN.ACCESS, data.accessToken); diff --git a/src/hooks/useUser.ts b/src/hooks/useUser.ts index 2df16d3c..b4851258 100644 --- a/src/hooks/useUser.ts +++ b/src/hooks/useUser.ts @@ -30,7 +30,7 @@ const useUser = (options?: UseUserOptions) => { error, refetch, } = useQuery( - [KEY.USER, Storage.getItem(TOKEN.ACCESS)], + [KEY.USER], async () => { const { data } = await httpClient.user.get(authorization()); return data;