hotfix: token exp 타임이 지나서 cookie를 삭제할 때의 error 해결

이유는 모르겠으나, getSession을 통해 쿠키의 userInfo를 삭제할 때 에러가 발생했다.
Cookies can only be modified in a Server Action or Route Handler.
위와 같은 에러가 발생했는데, 일반적인 메소드에서 쿠키를 변경하려 할 때 발생하는 에러인 것 같다.
나는 서버 컴포넌트에서 해당 메소드를 사용하면 문제가 되지 않을 줄 알았는데, 로그인처럼 서버 액션을
따로 만들어서 쿠키를 삭제해주어야 하는 모양이다. 일단 귀찮아서 getSession 내의 쿠키 삭제 로직을 지웠고,
middleware를 통해 라우팅시 유효기간이 지난 유저정보를 삭제할 수 있도록 수정했다.

app/page.tsx

@@ -1,9 +1,7 @@
-import HoveringButton from '@/components/common/HoveringButton';
 import HoveringLink from '@/components/common/HoveringLink';
 import VoteBanner from '@/components/home/VoteBanner';
 import { TUserInfo } from '@/types';
 import { getSession } from '@/utils/auth';
-import { useRouter } from 'next/navigation';
 
 const Home = async () => {
   const userInfo: TUserInfo | null = await getSession();

middleware.ts

@@ -1,9 +1,9 @@
-import { getSession } from '@/utils/auth';
 import { NextResponse } from 'next/server';
 import type { NextRequest } from 'next/server';
 
 export async function middleware(request: NextRequest) {
-  const userInfo = await getSession();
+  const stored = request.cookies.get('user_info');
+  const userInfo = stored ? JSON.parse(stored.value) : null;
 
   if (userInfo && request.nextUrl.pathname === '/join')
     return NextResponse.redirect(new URL('/', request.url));
@@ -13,6 +13,12 @@ export async function middleware(request: NextRequest) {
     return NextResponse.redirect(new URL('/login', request.url));
   }
 
+  if (userInfo.expTime < new Date().getTime()) {
+    const response = NextResponse.redirect(new URL('/login', request.url));
+    response.cookies.delete('user_info');
+    return response;
+  }
+
   if (userInfo.candidateVoted && request.nextUrl.pathname === '/partvote')
     return NextResponse.redirect(new URL('/partvote/result', request.url));
   if (userInfo.teamVoted && request.nextUrl.pathname === '/demovote')

utils/auth.ts

@@ -1,3 +1,5 @@
+'use server';
+
 import { TUserInfo } from '@/types';
 import { cookies } from 'next/headers';
 
@@ -9,7 +11,7 @@ export const getSession = async () => {
   }
   const userInfo: TUserInfo = JSON.parse(stored.value);
   if (userInfo.expTime < new Date().getTime()) {
-    cookieStore.delete('user_info');
+    // cookieStore.delete('user_info');
     return null;
   }
   return userInfo;

yarn.lock

@@ -523,7 +523,12 @@ camelcase-css@^2.0.1:
   resolved "https://registry.yarnpkg.com/camelcase-css/-/camelcase-css-2.0.1.tgz#ee978f6947914cc30c6b44741b6ed1df7f043fd5"
   integrity sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==
 
-caniuse-lite@^1.0.30001406, caniuse-lite@^1.0.30001538, caniuse-lite@^1.0.30001541:
+caniuse-lite@^1.0.30001406:
+  version "1.0.30001572"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001572.tgz#1ccf7dc92d2ee2f92ed3a54e11b7b4a3041acfa0"
+  integrity sha512-1Pbh5FLmn5y4+QhNyJE9j3/7dK44dGB83/ZMjv/qJk86TvDbjk0LosiZo0i0WB0Vx607qMX9jYrn1VLHCkN4rw==
+
+caniuse-lite@^1.0.30001538, caniuse-lite@^1.0.30001541:
   version "1.0.30001563"
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001563.tgz#aa68a64188903e98f36eb9c56e48fba0c1fe2a32"
   integrity sha512-na2WUmOxnwIZtwnFI2CZ/3er0wdNzU7hN+cPYz/z2ajHThnkWjNBOpEPP4n+4r2WPM847JaMotaJE3bnfzjyKw==