From e2b9182d730e2514d03bbd80e076e4786ea95abc Mon Sep 17 00:00:00 2001
From: DongjaJ <jdh981118@naver.com>
Date: Sun, 5 Nov 2023 16:36:48 +0900
Subject: [PATCH] =?UTF-8?q?feat(shared):=20axios=20Interceptor=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/shared/api/axiosInstance.ts    | 72 +++++++++++++++++++++++++
 packages/shared/api/axiosInterceptor.ts | 22 ++++++++
 packages/shared/constants/baseURL.ts    |  1 +
 packages/shared/package.json            |  1 +
 pnpm-lock.yaml                          |  3 ++
 5 files changed, 99 insertions(+)
 create mode 100644 packages/shared/api/axiosInstance.ts
 create mode 100644 packages/shared/api/axiosInterceptor.ts
 create mode 100644 packages/shared/constants/baseURL.ts

diff --git a/packages/shared/api/axiosInstance.ts b/packages/shared/api/axiosInstance.ts
new file mode 100644
index 00000000..1b020abc
--- /dev/null
+++ b/packages/shared/api/axiosInstance.ts
@@ -0,0 +1,72 @@
+import axios, {
+  AxiosInstance,
+  AxiosRequestConfig,
+  AxiosResponse,
+  InternalAxiosRequestConfig,
+} from 'axios';
+
+import { BASE_URL } from '@/constants/baseURL';
+
+import {
+  onErrorRequest,
+  onErrorResponse,
+  onRequest,
+  onResponse,
+} from './axiosInterceptor';
+
+type interceptors = {
+  onRequest: (config: InternalAxiosRequestConfig) => InternalAxiosRequestConfig;
+  onErrorRequest: (error: Error) => void | Promise<never>;
+  onResponse: (response: AxiosResponse) => AxiosResponse;
+  onErrorResponse: (error: Error) => void | Promise<never>;
+};
+
+class AxiosService {
+  private static instance: AxiosService;
+
+  private constructor(private axiosInstance: AxiosInstance) {}
+
+  public static getInstance({
+    onRequest,
+    onErrorRequest,
+    onResponse,
+    onErrorResponse,
+  }: interceptors): AxiosService {
+    if (!AxiosService.instance) {
+      const axiosInstance = axios.create({ baseURL: BASE_URL });
+      axiosInstance.interceptors.request.use(onRequest, onErrorRequest);
+      axiosInstance.interceptors.response.use(onResponse, onErrorResponse);
+      this.instance = new AxiosService(axiosInstance);
+    }
+    return this.instance;
+  }
+
+  public get<Response, Request>(
+    url: string,
+    config: AxiosRequestConfig<Request>,
+  ) {
+    return this.axiosInstance.get<Response>(url, config);
+  }
+
+  public post<Response, Request>(url: string, data: Request) {
+    return this.axiosInstance.post<Response>(url, data);
+  }
+
+  public delete<Response, Request>(
+    url: string,
+    config: AxiosRequestConfig<Request>,
+  ) {
+    return this.axiosInstance.delete<Response>(url, config);
+  }
+
+  public patch<Response, Request>(url: string, data: Request) {
+    return this.axiosInstance.patch<Response>(url, data);
+  }
+}
+
+export default AxiosService.getInstance({
+  onRequest,
+  onErrorRequest,
+  onResponse,
+  onErrorResponse,
+});
diff --git a/packages/shared/api/axiosInterceptor.ts b/packages/shared/api/axiosInterceptor.ts
new file mode 100644
index 00000000..627b62cd
--- /dev/null
+++ b/packages/shared/api/axiosInterceptor.ts
@@ -0,0 +1,22 @@
+import { AxiosResponse, InternalAxiosRequestConfig } from 'axios';
+
+export const onRequest = (config: InternalAxiosRequestConfig) => {
+  return config;
+};
+
+export const onErrorRequest = (error: Error) => {
+  return Promise.reject(error);
+};
+export const onResponse = (response: AxiosResponse) => {
+  return response.data;
+};
+export const onErrorResponse = (error: Error) => {
+  return Promise.reject(error);
+};
+
+export default {
+  onRequest,
+  onErrorRequest,
+  onResponse,
+  onErrorResponse,
+};
diff --git a/packages/shared/constants/baseURL.ts b/packages/shared/constants/baseURL.ts
new file mode 100644
index 00000000..8f8ae81b
--- /dev/null
+++ b/packages/shared/constants/baseURL.ts
@@ -0,0 +1 @@
+export const BASE_URL = '/example';
diff --git a/packages/shared/package.json b/packages/shared/package.json
index bf2312af..669c3cbd 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -11,6 +11,7 @@
     "@chakra-ui/react": "^2.8.1",
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
+    "axios": "^1.6.0",
     "framer-motion": "^10.16.4",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index d1895883..414b88fc 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -257,6 +257,9 @@ importers:
       '@emotion/styled':
         specifier: ^11.11.0
         version: 11.11.0(@emotion/react@11.11.1)(@types/react@18.2.33)(react@18.2.0)
+      axios:
+        specifier: ^1.6.0
+        version: 1.6.0
       framer-motion:
         specifier: ^10.16.4
         version: 10.16.4(react-dom@18.2.0)(react@18.2.0)