jwt토큰 만료 로그아웃동작 추가
All checks were successful
Build And Test / build-and-push (push) Successful in 1m11s
All checks were successful
Build And Test / build-and-push (push) Successful in 1m11s
This commit is contained in:
@ -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,
|
||||
|
@ -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,
|
||||
|
@ -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,
|
||||
|
@ -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
|
||||
|
14
src/api/createApi.js
Normal file
14
src/api/createApi.js
Normal file
@ -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;
|
||||
};
|
@ -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,
|
||||
|
@ -1,3 +1,4 @@
|
||||
// src/api/tokenUtils.js
|
||||
import axios from 'axios';
|
||||
|
||||
export const refreshAccessToken = async () => {
|
||||
|
@ -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 token = localStorage.getItem('access');
|
||||
if (token) {
|
||||
const decoded = decodeToken(token); // payload 추출
|
||||
setUser(decoded);
|
||||
setIsLoggedIn(true);
|
||||
}
|
||||
}, []);
|
||||
const logout = () => {
|
||||
localStorage.removeItem('access');
|
||||
localStorage.removeItem('refresh');
|
||||
setUser(null);
|
||||
setIsLoggedIn(false);
|
||||
};
|
||||
|
||||
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 = () => {
|
||||
localStorage.removeItem('access');
|
||||
localStorage.removeItem('refresh');
|
||||
setUser(null); // ✅ 로그아웃 시 제거
|
||||
setIsLoggedIn(false);
|
||||
};
|
||||
useEffect(() => {
|
||||
const token = localStorage.getItem('access');
|
||||
if (token) {
|
||||
const decoded = decodeToken(token);
|
||||
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);
|
Reference in New Issue
Block a user