I'm currently developing a Spotify Clone using its API and utilizing Next JS Middleware to enforce redirect conditions. The purpose of these conditions is to verify if the user has a token; if not, they should be redirected to the login page.
For some unknown reason, I'm encountering a blank white screen while running the application.
Below is the content of the middleware.ts
file
import { getToken } from "next-auth/jwt";
import { NextResponse, NextRequest } from "next/server";
export async function middleware(request: NextRequest) {
const token = await getToken({ req: request, secret: process.env.JWT_SECRET });
const { pathname } = request.nextUrl;
if (pathname.includes("/api/auth") || token) {
return NextResponse.next();
}
if (!token && pathname !== '/login') {
return NextResponse.rewrite(new URL('/login', request.url));
}
}
The directory structure looks like this
https://i.sstatic.net/HLdr6.png
If you can offer any assistance, it would be greatly appreciated. You can find the full code here https://github.com/dipesh2508/Vibes