From 41a26567777d399bcc8fa1c17387e46c8a8e1959 Mon Sep 17 00:00:00 2001 From: nijuy Date: Tue, 4 Jun 2024 23:56:38 +0900 Subject: [PATCH 1/3] =?UTF-8?q?feat:=20`authClient.response.interceptor`?= =?UTF-8?q?=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - accessToken 재발급 과정에서도 에러 나면 로그아웃 처리 --- src/apis/index.ts | 26 ++++++++++++++++++++------ 1 file changed, 20 insertions(+), 6 deletions(-) diff --git a/src/apis/index.ts b/src/apis/index.ts index ebb6cf15..30133d86 100644 --- a/src/apis/index.ts +++ b/src/apis/index.ts @@ -28,18 +28,18 @@ soomsilClient.interceptors.request.use((config) => { const onFulfilled = (response: AxiosResponse) => response; -const onRejected = async (error: AxiosError) => { +const onRejectedSoomsil = async (error: AxiosError) => { const originalConfig = error.config; const data = error.response?.data as AuthErrorData; if (originalConfig && error.response?.status === 401 && data?.error === 'Auth-002') { try { - await refreshToken(); + const response = await refreshToken(); + + if (response.error) return; + return soomsilClient.request({ ...originalConfig, - headers: { - Authorization: `Bearer ${api.getAccessToken()}`, - }, }); } catch (error) { return Promise.reject(error); @@ -48,4 +48,18 @@ const onRejected = async (error: AxiosError) => { return Promise.reject(error); }; -soomsilClient.interceptors.response.use(onFulfilled, onRejected); +soomsilClient.interceptors.response.use(onFulfilled, onRejectedSoomsil); + +const onRejectedAuth = async (error: AxiosError) => { + const originalConfig = error.config; + + if (error.response?.status === 401 && originalConfig?.url === '/auth/refresh') { + api.logout(); + sessionStorage.removeItem('user'); + window.location.reload(); + } + + return Promise.reject(error); +}; + +authClient.interceptors.response.use(onFulfilled, onRejectedAuth); From 84716d924d233f204f508387ade9573c2e7d5c88 Mon Sep 17 00:00:00 2001 From: nijuy Date: Tue, 4 Jun 2024 23:59:20 +0900 Subject: [PATCH 2/3] =?UTF-8?q?refactor:=20interceptor=20=EC=9D=B8?= =?UTF-8?q?=EC=9E=90=EC=97=90=20=ED=95=A8=EC=88=98=20=EB=B0=94=EB=A1=9C=20?= =?UTF-8?q?=EB=84=A3=EB=8A=94=20=EB=B0=A9=EC=8B=9D=EC=9C=BC=EB=A1=9C=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/index.ts | 56 +++++++++++++++++++++++------------------------ 1 file changed, 28 insertions(+), 28 deletions(-) diff --git a/src/apis/index.ts b/src/apis/index.ts index 30133d86..00d3b242 100644 --- a/src/apis/index.ts +++ b/src/apis/index.ts @@ -26,40 +26,40 @@ soomsilClient.interceptors.request.use((config) => { return config; }); -const onFulfilled = (response: AxiosResponse) => response; +soomsilClient.interceptors.response.use( + (response: AxiosResponse) => response, + async (error: AxiosError) => { + const originalConfig = error.config; + const data = error.response?.data as AuthErrorData; -const onRejectedSoomsil = async (error: AxiosError) => { - const originalConfig = error.config; - const data = error.response?.data as AuthErrorData; + if (originalConfig && error.response?.status === 401 && data?.error === 'Auth-002') { + try { + const response = await refreshToken(); - if (originalConfig && error.response?.status === 401 && data?.error === 'Auth-002') { - try { - const response = await refreshToken(); + if (response.error) return; - if (response.error) return; - - return soomsilClient.request({ - ...originalConfig, - }); - } catch (error) { - return Promise.reject(error); + return soomsilClient.request({ + ...originalConfig, + }); + } catch (error) { + return Promise.reject(error); + } } + return Promise.reject(error); } - return Promise.reject(error); -}; +); -soomsilClient.interceptors.response.use(onFulfilled, onRejectedSoomsil); +authClient.interceptors.response.use( + (response: AxiosResponse) => response, + async (error: AxiosError) => { + const originalConfig = error.config; -const onRejectedAuth = async (error: AxiosError) => { - const originalConfig = error.config; + if (error.response?.status === 401 && originalConfig?.url === '/auth/refresh') { + api.logout(); + sessionStorage.removeItem('user'); + window.location.reload(); + } - if (error.response?.status === 401 && originalConfig?.url === '/auth/refresh') { - api.logout(); - sessionStorage.removeItem('user'); - window.location.reload(); + return Promise.reject(error); } - - return Promise.reject(error); -}; - -authClient.interceptors.response.use(onFulfilled, onRejectedAuth); +); From 4c893c4df83d98fd046fe4a3eca631bab9df6e73 Mon Sep 17 00:00:00 2001 From: nijuy Date: Sun, 23 Jun 2024 23:23:33 +0900 Subject: [PATCH 3/3] =?UTF-8?q?refactor:=20=EB=A1=9C=EA=B7=B8=EC=95=84?= =?UTF-8?q?=EC=9B=83=20=EC=B2=98=EB=A6=AC=EB=A5=BC=20soomsilClient?= =?UTF-8?q?=EB=A1=9C=20=EC=9D=B4=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - authClient용 인터셉터 삭제 - refreshToken 함수 수정 --- src/apis/index.ts | 26 ++++++++------------------ src/home/apis/postRefreshToken.ts | 21 ++++++--------------- 2 files changed, 14 insertions(+), 33 deletions(-) diff --git a/src/apis/index.ts b/src/apis/index.ts index 00d3b242..f07d5b7d 100644 --- a/src/apis/index.ts +++ b/src/apis/index.ts @@ -1,6 +1,6 @@ import axios, { AxiosError, AxiosResponse } from 'axios'; -import { refreshToken } from '@/home/apis/postRefreshToken'; +import { postRefreshToken } from '@/home/apis/postRefreshToken'; import { AuthErrorData } from '@/home/types/Auth.type'; import { api } from '@/service/TokenService'; @@ -34,32 +34,22 @@ soomsilClient.interceptors.response.use( if (originalConfig && error.response?.status === 401 && data?.error === 'Auth-002') { try { - const response = await refreshToken(); + const { accessToken, accessTokenExpiredIn, refreshToken, refreshTokenExpiredIn } = + await postRefreshToken(); - if (response.error) return; + api.setAccessToken(accessToken, accessTokenExpiredIn); + api.setRefreshToken(refreshToken, refreshTokenExpiredIn); return soomsilClient.request({ ...originalConfig, }); } catch (error) { + api.logout(); + sessionStorage.removeItem('user'); + window.location.reload(); return Promise.reject(error); } } return Promise.reject(error); } ); - -authClient.interceptors.response.use( - (response: AxiosResponse) => response, - async (error: AxiosError) => { - const originalConfig = error.config; - - if (error.response?.status === 401 && originalConfig?.url === '/auth/refresh') { - api.logout(); - sessionStorage.removeItem('user'); - window.location.reload(); - } - - return Promise.reject(error); - } -); diff --git a/src/home/apis/postRefreshToken.ts b/src/home/apis/postRefreshToken.ts index 1fecedcc..0ea9933e 100644 --- a/src/home/apis/postRefreshToken.ts +++ b/src/home/apis/postRefreshToken.ts @@ -1,21 +1,12 @@ -import { AxiosError } from 'axios'; - import { authClient } from '@/apis'; import { api } from '@/service/TokenService'; -import { AuthErrorData, PostAuthResponse } from '../types/Auth.type'; - -export const refreshToken = async (): Promise => { - try { - const { data } = await authClient.post('/auth/refresh', { - refreshToken: api.getRefreshToken(), - }); +import { PostAuthSignInData } from '../types/Auth.type'; - api.setAccessToken(data.accessToken, data.accessTokenExpiredIn); - api.setRefreshToken(data.refreshToken, data.refreshTokenExpiredIn); +export const postRefreshToken = async (): Promise => { + const { data } = await authClient.post('/auth/refresh', { + refreshToken: api.getRefreshToken(), + }); - return data; - } catch (error: unknown) { - return { error: error as AxiosError }; - } + return data; };