jwt토큰 만료 로그아웃동작 추가

src/api/ansibleApi.js

@@ -1,6 +1,8 @@
 // src/api/todoApi.js
 import axios from 'axios';
 import { attachAuthInterceptors } from './attachInterceptors';
+import { createApi } from './createApi';
+export const initAnsibleApi = (logout) => createApi(process.env.REACT_APP_API_ANSIBLE, logout);
 
 const ansibleApi = axios.create({
   baseURL: process.env.REACT_APP_API_ANSIBLE,

src/api/authApi.js

@@ -1,6 +1,8 @@
 // src/api/authApi.js
 import axios from "axios";
 import { attachAuthInterceptors } from "./attachInterceptors";
+import { createApi } from './createApi';
+export const initAuthApi = (logout) => createApi(process.env.REACT_APP_API_AUTH, logout);
 
 const authApi = axios.create({
   baseURL: process.env.REACT_APP_API_AUTH,

src/api/blogApi.js

@@ -1,6 +1,8 @@
 // src/api/blogApi.js
 import axios from 'axios';
 import { attachAuthInterceptors } from './attachInterceptors';
+import { createApi } from './createApi';
+export const initBlogApi = (logout) => createApi(process.env.REACT_APP_API_BLOG, logout);
 
 const blogApi = axios.create({
   baseURL: process.env.REACT_APP_API_BLOG,

src/api/boardApi.js

@@ -1,5 +1,8 @@
+// src/api/boardApi.js
 import axios from "axios";
 import { attachAuthInterceptors } from "./attachInterceptors";
+import { createApi } from './createApi';
+export const initBoardApi = (logout) => createApi(process.env.REACT_APP_API_BOARD, logout);
 
 const boardApi = axios.create({
   baseURL: process.env.REACT_APP_API_BOARD, // ex) http://localhost:8801/api

src/api/createApi.js

@@ -0,0 +1,14 @@
+// src/api/createApi.js
+import axios from 'axios';
+import { attachAuthInterceptors } from './attachInterceptors';
+
+
+export const createApi = (baseURL, logout = null) => {
+  const instance = axios.create({
+    baseURL,
+    headers: { 'Content-Type': 'application/json' },
+  });
+
+  attachAuthInterceptors(instance, logout);
+  return instance;
+};

src/api/todoApi.js

@@ -1,6 +1,8 @@
 // src/api/todoApi.js
 import axios from 'axios';
 import { attachAuthInterceptors } from './attachInterceptors';
+import { createApi } from './createApi';
+export const initTodoApi = (logout) => createApi(process.env.REACT_APP_API_TODO, logout);
 
 const todoApi = axios.create({
   baseURL: process.env.REACT_APP_API_TODO,

src/api/tokenUtils.js

@@ -1,3 +1,4 @@
+// src/api/tokenUtils.js
 import axios from 'axios';
 
 export const refreshAccessToken = async () => {

src/context/AuthContext.js

@@ -1,36 +1,48 @@
-// src/context/AuthContext.js
+// ✅ 8. src/context/AuthContext.js
 import { createContext, useContext, useState, useEffect } from 'react';
-import { decodeToken } from '../utils/jwt';  // ✅ JWT 디코딩 유틸 사용
+import { decodeToken } from '../utils/jwt';
+import { initAuthApi } from '../api/authApi';
+import { initBlogApi } from '../api/blogApi';
+import { initBoardApi } from '../api/boardApi';
+import { initTodoApi } from '../api/todoApi';
+import { initAnsibleApi } from '../api/ansibleApi';
 
 const AuthContext = createContext();
 
 export const AuthProvider = ({ children }) => {
   const [isLoggedIn, setIsLoggedIn] = useState(false);
-  const [user, setUser] = useState(null);  // ✅ 추가
+  const [user, setUser] = useState(null);
 
-  useEffect(() => {
+  const logout = () => {
-    const token = localStorage.getItem('access');
+    localStorage.removeItem('access');
-    if (token) {
+    localStorage.removeItem('refresh');
-      const decoded = decodeToken(token);  // payload 추출
+    setUser(null);
-      setUser(decoded);
+    setIsLoggedIn(false);
-      setIsLoggedIn(true);
+  };
-    }
-  }, []);
 
   const login = (tokenObj) => {
     localStorage.setItem('access', tokenObj.access);
     localStorage.setItem('refresh', tokenObj.refresh);
     const decoded = decodeToken(tokenObj.access);
-    setUser(decoded);  // ✅ 로그인 시 user 저장
+    setUser(decoded);
     setIsLoggedIn(true);
   };
 
-  const logout = () => {
+  useEffect(() => {
-    localStorage.removeItem('access');
+    const token = localStorage.getItem('access');
-    localStorage.removeItem('refresh');
+    if (token) {
-    setUser(null);  // ✅ 로그아웃 시 제거
+      const decoded = decodeToken(token);
-    setIsLoggedIn(false);
+      setUser(decoded);
-  };
+      setIsLoggedIn(true);
+    }
+
+    // ✅ API 초기화 시 logout 주입
+    initAuthApi(logout);
+    initBlogApi(logout);
+    initBoardApi(logout);
+    initTodoApi(logout);
+    initAnsibleApi(logout);
+  }, []);
 
   return (
     <AuthContext.Provider value={{ isLoggedIn, login, logout, user }}>
@@ -39,4 +51,4 @@ export const AuthProvider = ({ children }) => {
   );
 };
 
-export const useAuth = () => useContext(AuthContext);
+export const useAuth = () => useContext(AuthContext);

version

@@ -1 +1 @@
-0.0.17-rc2
+0.0.17-rc3