[Nextjs] 프로텍트 라우팅(로그인 여부 확인 후 라우팅 처리)

import { cookies } from "next/headers";
import { NextResponse } from "next/server";
import type { NextRequest } from "next/server";

export async function middleware(req: NextRequest) {
    const cookieData = await cookies();
    const token = cookieData.get("TokenData");
    const publicPaths = ["/login", "/sign-up"];
    const isPublicPath = publicPaths.includes(req.nextUrl.pathname);
    const isFile = req.nextUrl.pathname.match(/\.(.*)$/);
    const isApiRoute = req.nextUrl.pathname.startsWith("/api");

    if (isFile || isApiRoute) {
        return NextResponse.next();
    }

    if (isPublicPath && token) {
        return NextResponse.redirect(new URL("/home", req.url));
    }

    if (!isPublicPath && !token) {
        return NextResponse.redirect(new URL("/login", req.url));
    }

    return NextResponse.next();
}

 

왜 안되지 하고 있는데, 위치를 잘못 넣었다.

src/app/middleware.tsx

가 아닌

src/middleware.tsx로 해야하는 것...

 

 

== 참고 문서 ===

https://nextjs.org/docs/app/building-your-application/routing/middleware

Routing: Middleware | Next.js

https://s0ojin.tistory.com/76

[Next.js] Next.js 14에서 private route처리하기 (middleware.ts)