All of a sudden my middleware stopped working in deployment. The error is:
> Build error occurred
NestedMiddlewareError: Nested Middleware is not allowed, found:
pages/_middleware
Please move your code to a single file at /middleware instead.
Vercel statement is: For example, a Middleware at pages/about/_middleware.ts can move the logic to /middleware.ts in the root of your repository. Then, a conditional statement can be used to only run the Middleware when it matches the about/* path:
When I run my local build with pages/_middleware.ts it finishes without errors like it did up to today on production. If I change it to pages/middleware.ts localy it fails with:
./pages/middleware.ts
2:1 Error: next/server should not be imported outside of pages/_middleware.js. See: https://nextjs.org/docs/messages/no-server-import-in-page @next/next/no-server-import-in-page
Middleware file:
import { getToken } from "next-auth/jwt";
import { NextRequest, NextResponse } from "next/server";
export async function middleware(req: NextRequest, res: NextResponse) {
if (req.nextUrl.pathname === "/") {
const session = await getToken({
req,
secret: process.env.JWT_SECRET,
secureCookie: process.env.NODE_ENV === "production",
});
// You could also check for any property on the session object,
// like role === "admin" or name === "John Doe", etc.
if (!session) {
const url = req.nextUrl.clone();
url.pathname = "/login";
return NextResponse.redirect(url);
}
// If user is authenticated, continue.
}
}
