Skip to content

Commit

Permalink
Merge pull request #144 from TripInfoWeb/dev_informations
Browse files Browse the repository at this point in the history
Fix: UI 오류 및 자동 로그인 오류 발생 시 로그인 페이지로 접속할 수 없는 문제 해결
  • Loading branch information
HyunJinNo authored Jul 28, 2024
2 parents 5f50484 + 9be55a1 commit 3c32b48
Show file tree
Hide file tree
Showing 6 changed files with 46 additions and 40 deletions.
60 changes: 32 additions & 28 deletions src/app/api/auth/user/route.ts
Original file line number Diff line number Diff line change
@@ -1,35 +1,39 @@
import { cookies } from "next/headers";
import { NextRequest, NextResponse } from "next/server";

export async function GET(request: NextRequest) {
const access_cookie = request.cookies.get("access_token");
if (!access_cookie) {
const access_cookie = request.cookies.get("access_token");
if (!access_cookie) {
const refresh_cookie = request.cookies.get("refresh_token");
if (!refresh_cookie) {
// 리프레시 토큰이 없으므로 요청 중단
return new NextResponse("Refresh token not found", { status: 403 });
}
// 리프레시 토큰으로 재발급 받아 재요청 보내기 위한 응답
return new NextResponse("Refresh token not found", { status: 401 });
if (!refresh_cookie) {
// 리프레시 토큰이 없으므로 요청 중단
return new NextResponse("Refresh token not found", { status: 403 });
}

// 사용자 정보 조회 API
const response = await fetch(`${process.env.BACKEND_URL}/api/users/info`, {
method: "GET",
headers: {
Cookie: `${access_cookie?.name}=${access_cookie?.value}`,
"Content-Type": "application/json",
"Access-Control-Allow-Origin": "*",
},
cache: "no-store",
});

if (response.status === 200) {
const data = await response.json();
return new NextResponse(JSON.stringify(data), {
status: 200,
});
}
return new NextResponse("서버 에러", {
status: 500,
// 리프레시 토큰으로 재발급 받아 재요청 보내기 위한 응답
return new NextResponse("Refresh token not found", { status: 401 });
}

// 사용자 정보 조회 API
const response = await fetch(`${process.env.BACKEND_URL}/api/users/info`, {
method: "GET",
headers: {
Cookie: `${access_cookie?.name}=${access_cookie?.value}`,
"Content-Type": "application/json",
"Access-Control-Allow-Origin": "*",
},
cache: "no-store",
});

if (response.status === 200) {
const data = await response.json();
return new NextResponse(JSON.stringify(data), {
status: 200,
});
}

cookies().delete("access_token");
cookies().delete("refresh_token");
return new NextResponse("서버 에러", {
status: 500,
});
}
4 changes: 2 additions & 2 deletions src/components/common/Header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -58,9 +58,9 @@ const Header = ({
/>
</Link>
</div>
<div className="flex flex-grow flex-row justify-between px-28 max-[744px]:hidden">
<div className="flex flex-grow flex-row justify-between pl-28 max-[744px]:hidden">
<nav>
<ul className="font flex flex-row space-x-10">
<ul className="flex flex-row gap-10">
<li>
<Link
className={
Expand Down
16 changes: 8 additions & 8 deletions src/components/common/HeaderSidebar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,15 +21,15 @@ const HeaderSidebar = ({
}: Props) => {
return (
<aside className="fixed left-0 top-0 z-50 flex h-[200%] w-full animate-sidebarFadeIn flex-row justify-end bg-black/25">
<nav className="flex h-fit w-[9.375rem] flex-col gap-4 rounded-b-lg bg-white p-4 pb-6 dark:bg-slate-800">
<nav className="flex h-fit w-[12.875rem] flex-col gap-4 rounded-b-lg bg-white p-4 pb-6 dark:bg-slate-800">
<div className="flex h-10 w-full items-center justify-end">
<div className="cursor-pointer rounded-md bg-gray-100 p-2 hover:text-main dark:bg-slate-600">
<MdClose onClick={onClose} />
</div>
</div>
<div className="flex flex-col gap-4 px-2">
<Link
className="flex flex-row items-center gap-2 text-sm hover:text-main dark:text-slate-200"
className="flex flex-row items-center gap-2 hover:text-main dark:text-slate-200"
href="/"
onClick={onClose}
onMouseEnter={() => setHoverNum(1)}
Expand All @@ -54,7 +54,7 @@ const HeaderSidebar = ({
<p></p>
</Link>
<Link
className="flex flex-row items-center gap-2 text-sm hover:text-main dark:text-slate-200"
className="flex flex-row items-center gap-2 hover:text-main dark:text-slate-200"
href="/informations/list/parent-category/1?page=1"
onClick={onClose}
onMouseEnter={() => setHoverNum(2)}
Expand All @@ -79,7 +79,7 @@ const HeaderSidebar = ({
<p>여행 정보</p>
</Link>
<Link
className="flex flex-row items-center gap-2 text-sm hover:text-main dark:text-slate-200"
className="flex flex-row items-center gap-2 hover:text-main dark:text-slate-200"
href="/gathering"
onClick={onClose}
onMouseEnter={() => setHoverNum(3)}
Expand All @@ -104,7 +104,7 @@ const HeaderSidebar = ({
<p>모임 정보</p>
</Link>
<Link
className="flex flex-row items-center gap-[0.375rem] text-sm hover:text-main dark:text-slate-200"
className="flex flex-row items-center gap-[0.375rem] hover:text-main dark:text-slate-200"
href="/diary/list"
onClick={onClose}
onMouseEnter={() => setHoverNum(4)}
Expand Down Expand Up @@ -133,7 +133,7 @@ const HeaderSidebar = ({
{signedIn ? (
<div className="flex flex-col gap-4">
<Link
className="flex flex-row items-center gap-[0.5625rem] text-sm hover:text-main dark:text-slate-200"
className="flex flex-row items-center gap-[0.5625rem] hover:text-main dark:text-slate-200"
href="/mypage"
onClick={onClose}
onMouseEnter={() => setHoverNum(5)}
Expand All @@ -160,7 +160,7 @@ const HeaderSidebar = ({
<p>마이페이지</p>
</Link>
<button
className="flex flex-row items-center gap-[0.4375rem] text-sm hover:text-main dark:text-slate-200"
className="flex flex-row items-center gap-[0.4375rem] hover:text-main dark:text-slate-200"
onClick={logoutHandler}
>
<CiLogout className="-ml-[0.125rem]" size={"1.2rem"} />
Expand All @@ -169,7 +169,7 @@ const HeaderSidebar = ({
</div>
) : (
<Link
className="flex flex-row items-center gap-[0.5625rem] text-sm hover:text-main dark:text-slate-200"
className="flex flex-row items-center gap-[0.5625rem] hover:text-main dark:text-slate-200"
href="/auth/signin"
onClick={onClose}
onMouseEnter={() => setHoverNum(5)}
Expand Down
4 changes: 2 additions & 2 deletions src/components/informations/write/CategoryModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ const CategoryModal = ({
onClick={onCancel}
/>
</div>
<div className="flex flex-row items-center gap-2">
<div className="flex flex-row flex-wrap items-center gap-2">
{categories?.map((category, index) => (
<button
key={index}
Expand All @@ -56,7 +56,7 @@ const CategoryModal = ({
소분류 선택
</h3>
)}
<div className="flex flex-wrap items-center gap-2">
<div className="flex flex-row flex-wrap items-center gap-2">
{categories
?.find((category) => parentCategory === category.id)
?.childrenCategories?.map((category, index) => (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,7 @@ const CategoryModalContainer = ({ closeModal }: Props) => {
if (!response.ok) {
throw new Error(response.statusText);
}

setCategories(await (response.json() as Promise<CategoryResponseDto[]>));
})();
}, []);
Expand Down
1 change: 1 addition & 0 deletions src/utils/fetchWithAuth.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ export async function fetchWithAuth(url: string, options = {}, retries = 1) {
const data = await fetch(`/api/auth/refresh-access-token`, {
method: "POST",
});

if (data.status == 401) {
return Promise.reject({
status: 401,
Expand Down

0 comments on commit 3c32b48

Please sign in to comment.