토큰을 가져오지 못하는 오류 해결

package.json

@@ -25,7 +25,6 @@
     "clsx": "^2.1.1",
     "cookie": "^1.0.1",
     "framer-motion": "^11.9.0",
-    "js-cookie": "^3.0.5",
     "lucide-react": "^0.446.0",
     "next": "14.2.13",
     "next-themes": "^0.3.0",

src/app/api/logout/route.ts

@@ -1,3 +1,4 @@
+import { cookies } from "next/headers";
 import { NextResponse } from "next/server";
 
 export async function POST() {
@@ -9,4 +10,13 @@ export async function POST() {
       },
     }
   );
-}
+}
+
+export async function GET() {
+  const cookieStore = cookies();
+  const token = cookieStore.get("access_token");
+
+  return NextResponse.json({
+    token: token?.value || null,
+  });
+}

src/lib/axios.ts

@@ -1,5 +1,4 @@
 import axios, { AxiosInstance } from "axios";
-import Cookies from "js-cookie";
 
 const createAxiosInstance = (): AxiosInstance => {
   const instance = axios.create({
@@ -11,13 +10,18 @@ const createAxiosInstance = (): AxiosInstance => {
   });
 
   instance.interceptors.request.use(
-    (config) => {
-      const token = Cookies.get("access_token");
+    async (config) => {
+      try {
+        const response = await fetch('/api/token')
+        const data = await response.json()
 
-      console.log('Access Token:', token);
-
-      if (token) {
-        config.headers.Authorization = `Bearer ${token}`;
+        console.log('Token:', data.token);
+
+        if (data.token) {
+          config.headers.Authorization = `Bearer ${data.token}`;
+        }
+      } catch (error) {
+        console.error('토큰 가져오기 실패:', error);
       }
 
       return config;