Merge pull request #25 from TripMingle/fix/SWM-272

[fix/SWM-272] 오류, middleware, apihandler, error 처리 수정
TripMingle · Nov 21, 2024 · 111cd7f · 111cd7f
2 parents 669eaa2 + 10b0190
commit 111cd7f
Show file tree

Hide file tree

Showing 30 changed files with 463 additions and 386 deletions.
diff --git a/src/app/(main)/page.tsx b/src/app/(main)/page.tsx
@@ -11,7 +11,8 @@ const Page = () => {
           className={styles.bg}
           src="/images/mainbg.png"
           fill
-          sizes="1920px"
+          priority
+          sizes="(max-width: 1920px) 100vw, 1920px"
           alt="mainBackground"
         />
         <CountrySearch />

diff --git a/src/app/[country]/board/[id]/page.tsx b/src/app/[country]/board/[id]/page.tsx
@@ -35,8 +35,9 @@ const Page = async ({
           className={styles.image}
           src={boardDetail.imageUrl || '/images/emptyBackground.png'}
           alt="boardImage"
+          priority
           fill
-          sizes="1920px"
+          sizes="(max-width: 1920px) 100vw, 1920px"
         />
       </div>
       <div className={styles.container}>

diff --git a/src/app/[country]/board/page.tsx b/src/app/[country]/board/page.tsx
@@ -4,10 +4,10 @@ import CountryBackground from '@/components/country/CountryBackground';
 import BoardList from '@/components/country/board/BoardList';
 import CountryWrite from '@/components/common/CountryWrite';
 
-const Page = () => {
+const Page = ({ params }: { params: { country: string } }) => {
   return (
     <>
-      <CountryBackground />
+      <CountryBackground country={params.country} />
       <div className={styles.bgOverlay}>
         <div className={styles.mapContainer}>
           <span className={styles.mapText}>

diff --git a/src/app/[country]/error.tsx b/src/app/[country]/error.tsx
@@ -0,0 +1,21 @@
+'use client';
+
+import { useRouter } from 'next/navigation';
+
+export default function Error({
+  error,
+  reset,
+}: {
+  error: Error;
+  reset: () => void;
+}) {
+  console.error('Error occurred:', error);
+  const router = useRouter();
+  return (
+    <div>
+      <h2>잘못된 나라 입력입니다.</h2>
+      <p>{error.message}</p>
+      <button onClick={() => router.replace('/')}>메인 페이지로 이동하기</button>
+    </div>
+  );
+}
diff --git a/src/app/[country]/page.tsx b/src/app/[country]/page.tsx
@@ -3,10 +3,10 @@ import BoardPreview from '@/components/country/BoardPreview';
 import CountryBackground from '@/components/country/CountryBackground';
 import PostPreview from '@/components/country/PostPreivew';
 
-const Page = () => {
+const Page = ({ params }: { params: { country: string } }) => {
   return (
     <>
-      <CountryBackground />
+      <CountryBackground country={params.country} />
       <div className={styles.contentContainer}>
         <BoardPreview />
         <PostPreview type="restaurant" />

diff --git a/src/app/[country]/post/page.tsx b/src/app/[country]/post/page.tsx
@@ -3,10 +3,10 @@ import CountryBackground from '@/components/country/CountryBackground';
 import PostCardList from '@/components/country/post/PostCardList';
 import CountryWrite from '@/components/common/CountryWrite';
 
-const Page = () => {
+const Page = ({ params }: { params: { country: string } }) => {
   return (
     <>
-      <CountryBackground />
+      <CountryBackground country={params.country} />
       <div className={country.contentContainer}>
         <PostCardList />
       </div>

diff --git a/src/app/api/board/comment/route.ts b/src/app/api/board/comment/route.ts
@@ -1,25 +1,21 @@
-import { getAccessToken } from '@/utils/server/token';
-import { NextRequest, NextResponse } from 'next/server';
+import { baseurl, withApiHandler } from '@/utils/server/api';
+import { NextRequest } from 'next/server';
 
-export const POST = async (req: NextRequest) => {
-  const baseurl = `${process.env.API_URL}`;
-  const pathname = `/board/comment`;
-  const body = req.body;
-  let token = await getAccessToken();
-  if (!token)
-    return NextResponse.json(
-      { error: 'access token이 없거나 만료되었습니다.' },
-      { status: 500 },
-    );
+export const POST = withApiHandler(
+  async (req: NextRequest, config: RequestInit) => {
+    const pathname = `/board/comment`;
+    const body = req.body;
 
-  return await fetch(`${baseurl}${pathname}`, {
-    method: 'POST',
-    headers: {
-      'Content-Type': 'application/json',
-      Authorization: `Bearer ${token.value}`,
-    },
-    body,
-    // @ts-ignore -- 연결이 단방향임을 나타냄
-    duplex: 'half',
-  });
-};
+    return await fetch(`${baseurl}${pathname}`, {
+      ...config,
+      method: 'POST',
+      headers: {
+        ...config.headers,
+        'Content-Type': 'application/json',
+      },
+      body,
+      // @ts-ignore -- 연결이 단방향임을 나타냄
+      duplex: 'half',
+    });
+  },
+);
diff --git a/src/app/api/board/list/route.ts b/src/app/api/board/list/route.ts
@@ -1,21 +1,20 @@
-import { getAccessToken } from '@/utils/server/token';
+import { baseurl, withApiHandler } from '@/utils/server/api';
 import { NextRequest } from 'next/server';
 
-export const GET = async (req: NextRequest) => {
-  const baseurl = `${process.env.API_URL}`;
-  const pathname = '/board';
-  const country = req.nextUrl.searchParams.get('country');
-  const page = req.nextUrl.searchParams.get('page');
-  let accesstoken = await getAccessToken();
-  let token = accesstoken?.value || process.env.ACCESS_TOKEN;
+export const GET = withApiHandler(
+  async (req: NextRequest, config: RequestInit) => {
+    const pathname = '/board';
+    const country = req.nextUrl.searchParams.get('country');
+    const page = req.nextUrl.searchParams.get('page');
 
-  console.log(`${baseurl}${pathname}/${country}?page=${page}`);
-
-  return await fetch(`${baseurl}${pathname}/${country}?page=${page}`, {
-    method: 'GET',
-    headers: {
-      'Content-Type': 'application/json',
-      Authorization: `Bearer ${token}`,
-    },
-  });
-};
+    return await fetch(`${baseurl}${pathname}/${country}?page=${page}`, {
+      ...config,
+      method: 'GET',
+      headers: {
+        ...config.headers,
+        'Content-Type': 'application/json',
+      },
+    });
+  },
+  false,
+);
diff --git a/src/app/api/board/preview/route.ts b/src/app/api/board/preview/route.ts
@@ -1,18 +1,18 @@
-import { getAccessToken } from '@/utils/server/token';
+import { baseurl, withApiHandler } from '@/utils/server/api';
 import { NextRequest } from 'next/server';
 
-export const GET = async (req: NextRequest) => {
-  const baseurl = `${process.env.API_URL}`;
-  const pathname = req.nextUrl.pathname.slice(4);
-  const country = req.nextUrl.searchParams.get('country');
-  let accesstoken = await getAccessToken();
-  let token = accesstoken?.value || process.env.ACCESS_TOKEN;
+export const GET = withApiHandler(
+  async (req: NextRequest, config: RequestInit) => {
+    const pathname = req.nextUrl.pathname.slice(4);
+    const country = req.nextUrl.searchParams.get('country');
 
-  return await fetch(`${baseurl}${pathname}/${country}`, {
-    method: 'GET',
-    headers: {
-      'Content-Type': 'application/json',
-      Authorization: `Bearer ${token}`,
-    },
-  });
-};
+    return await fetch(`${baseurl}${pathname}/${country}`, {
+      method: 'GET',
+      headers: {
+        ...config.headers,
+        'Content-Type': 'application/json',
+      },
+    });
+  },
+  false,
+);
diff --git a/src/app/api/board/route.ts b/src/app/api/board/route.ts
@@ -1,41 +1,38 @@
-import { getAccessToken } from '@/utils/server/token';
-import { NextRequest, NextResponse } from 'next/server';
+import { baseurl, withApiHandler } from '@/utils/server/api';
+import { NextRequest } from 'next/server';
 
-export const GET = async (req: NextRequest) => {
-  const baseurl = `${process.env.API_URL}`;
-  const pathname = `/board/show`;
-  const boardId = req.nextUrl.searchParams.get('boardId');
-  let accesstoken = await getAccessToken();
-  let token = accesstoken?.value || process.env.ACCESS_TOKEN;
+export const GET = withApiHandler(
+  async (req: NextRequest, config: RequestInit) => {
+    const pathname = `/board/show`;
+    const boardId = req.nextUrl.searchParams.get('boardId');
 
-  return await fetch(`${baseurl}${pathname}/${boardId}`, {
-    method: 'GET',
-    headers: {
-      'Content-Type': 'application/json',
-      Authorization: `Bearer ${token}`,
-    },
-  });
-};
+    return await fetch(`${baseurl}${pathname}/${boardId}`, {
+      ...config,
+      method: 'GET',
+      headers: {
+        ...config.headers,
+        'Content-Type': 'application/json',
+      },
+    });
+  },
+  false,
+);
 
-export const POST = async (req: NextRequest) => {
-  const baseurl = `${process.env.API_URL}`;
-  const pathname = `/board`;
-  const body = req.body;
-  let token = await getAccessToken();
-  if (!token)
-    return NextResponse.json(
-      { error: 'access token이 없거나 만료되었습니다.' },
-      { status: 500 },
-    );
+export const POST = withApiHandler(
+  async (req: NextRequest, config: RequestInit) => {
+    const pathname = `/board`;
+    const body = req.body;
 
-  return await fetch(`${baseurl}${pathname}`, {
-    method: 'POST',
-    headers: {
-      'Content-Type': 'application/json',
-      Authorization: `Bearer ${token.value}`,
-    },
-    body,
-    // @ts-ignore -- 연결이 단방향임을 나타냄
-    duplex: 'half',
-  });
-};
+    return await fetch(`${baseurl}${pathname}`, {
+      ...config,
+      method: 'POST',
+      headers: {
+        ...config.headers,
+        'Content-Type': 'application/json',
+      },
+      body,
+      // @ts-ignore -- 연결이 단방향임을 나타냄
+      duplex: 'half',
+    });
+  },
+);
diff --git a/src/app/api/board/schedule/route.ts b/src/app/api/board/schedule/route.ts
@@ -1,18 +1,19 @@
+import { baseurl, withApiHandler } from '@/utils/server/api';
 import { getAccessToken } from '@/utils/server/token';
 import { NextRequest } from 'next/server';
 
-export const GET = async (req: NextRequest) => {
-  const baseurl = `${process.env.API_URL}`;
-  const pathname = `/board/schedule`;
-  const boardId = req.nextUrl.searchParams.get('boardId');
-  let accesstoken = await getAccessToken();
-  let token = accesstoken?.value || process.env.ACCESS_TOKEN;
+export const GET = withApiHandler(
+  async (req: NextRequest, config: RequestInit) => {
+    const pathname = `/board/schedule`;
+    const boardId = req.nextUrl.searchParams.get('boardId');
 
-  return await fetch(`${baseurl}${pathname}/${boardId}`, {
-    method: 'GET',
-    headers: {
-      'Content-Type': 'application/json',
-      Authorization: `Bearer ${token}`,
-    },
-  });
-};
+    return await fetch(`${baseurl}${pathname}/${boardId}`, {
+      method: 'GET',
+      headers: {
+        ...config.headers,
+        'Content-Type': 'application/json',
+      },
+    });
+  },
+  false,
+);
diff --git a/src/app/api/continent/[countinent]/route.ts b/src/app/api/continent/[countinent]/route.ts
@@ -1,13 +1,17 @@
+import { baseurl, withApiHandler } from '@/utils/server/api';
 import { NextRequest } from 'next/server';
 
-export const GET = async (req: NextRequest) => {
-  const baseurl = `${process.env.API_URL}`;
-  const pathname = req.nextUrl.pathname.slice(4);
-
-  return await fetch(`${baseurl}${pathname}`, {
-    method: 'GET',
-    headers: {
-      'Content-Type': 'application/json',
-    },
-  });
-};
+export const GET = withApiHandler(
+  async (req: NextRequest, config: RequestInit) => {
+    const pathname = req.nextUrl.pathname.slice(4);
+    return await fetch(`${baseurl}${pathname}`, {
+      ...config,
+      method: 'GET',
+      headers: {
+        ...config.headers,
+        'Content-Type': 'application/json',
+      },
+    });
+  },
+  false,
+);
diff --git a/src/app/api/country/[country]/route.ts b/src/app/api/country/[country]/route.ts
@@ -1,13 +1,17 @@
+import { baseurl, withApiHandler } from '@/utils/server/api';
 import { NextRequest } from 'next/server';
 
-export const GET = async (req: NextRequest) => {
-  const baseurl = `${process.env.API_URL}`;
-  const pathname = req.nextUrl.pathname.slice(4);
-
-  return await fetch(`${baseurl}${pathname}`, {
-    method: 'GET',
-    headers: {
-      'Content-Type': 'application/json',
-    },
-  });
-};
+export const GET = withApiHandler(
+  async (req: NextRequest, config: RequestInit) => {
+    const pathname = req.nextUrl.pathname.slice(4);
+    return await fetch(`${baseurl}${pathname}`, {
+      ...config,
+      method: 'GET',
+      headers: {
+        ...config.headers,
+        'Content-Type': 'application/json',
+      },
+    });
+  },
+  false,
+);
diff --git a/src/app/api/country/search/[keyword]/route.ts b/src/app/api/country/search/[keyword]/route.ts
@@ -1,15 +1,17 @@
+import { baseurl, withApiHandler } from '@/utils/server/api';
 import { NextRequest } from 'next/server';
 
-export const GET = async (req: NextRequest) => {
-  const baseurl = `${process.env.API_URL}`;
-  const pathname = req.nextUrl.pathname.slice(4);
-
-  console.log(baseurl, pathname);
-
-  return await fetch(`${baseurl}${pathname}`, {
-    method: 'GET',
-    headers: {
-      'Content-Type': 'application/json',
-    },
-  });
-};
+export const GET = withApiHandler(
+  async (req: NextRequest, config: RequestInit) => {
+    const pathname = req.nextUrl.pathname.slice(4);
+    return await fetch(`${baseurl}${pathname}`, {
+      ...config,
+      method: 'GET',
+      headers: {
+        ...config.headers,
+        'Content-Type': 'application/json',
+      },
+    });
+  },
+  false,
+);