如何取消保护下一个js中间件中的路由

Question

所以我想取消对登录页面的保护，这是我的文件夹结构：

这是我的中间件：

import { NextResponse, NextRequest } from "next/server";

export async function middleware(req, ev) {
  if (req.pathname === "login") {
    return NextResponse.next();
  }
  const token = req.cookies.token;

  if (!token) {
    return NextResponse.redirect("/login");
  }
  return NextResponse.next();
}

那么我该怎么做才能使中间件不适用于 login.js。

编辑：现在returns[webpack.cache.PackFileCacheStrategy] Caching failed for pack: Error: Unable to snapshot resolve dependencies

此项目的代码是 here

Answer 1

您可以检查 request 是否针对 /login 页面本身，并提前退出。

检查 NextRequest 上所有可用的属性。

import { NextResponse, NextRequest } from "next/server";

export async function middleware(req, ev) {
  if( req.pathname === 'login'){
      return NextResponse.next();
  }
  const token = req.cookies.token;

  if (!token) {
    return NextResponse.redirect("/login");
  }
  return NextResponse.next();
}

Answer 2

所以我解决了没有从 req.nextUrl 获取路径名的错误，这是正确的代码：

import { NextResponse, NextRequest } from "next/server";

export async function middleware(req, ev) {
  const { pathname } = req.nextUrl;
  const token = req.cookies.token;

  if (pathname == "/login" && !token) {
    return NextResponse.next();
  }

  if (!token) {
    return NextResponse.redirect("/login");
  }

  return NextResponse.next();
}

Answer 3

接受的答案对我帮助很大。我正在添加我的解决方案，因为我必须进行一些修改。

我将 [...nextauth].js 文件与 jwt 和 session 回调一起使用，当我使用接受的答案中的解决方案时，我得到了 ERR_TOO_MANY_REQUESTS 循环。我的解决方案是再添加几个 URL：

import { NextResponse } from "next/server";
import { getToken } from 'next-auth/jwt';

export default async function middleware(req, ev) {
  const { pathname } = req.nextUrl;
  const token = await getToken({ req, secret: process.env.JWT_SECRET });

  if ((pathname == "/api/auth/signin" || pathname == "/favicon.ico" || pathname == "/api/auth/callback/credentials") && !token) {
    return NextResponse.next();
  }

  if (!token) {
    return NextResponse.rewrite(new URL('/api/auth/signin', req.url));
  }

  return NextResponse.next();
}

如何取消保护下一个js中间件中的路由

How to unprotect route in next js middleware

javascript

middleware

node.js

reactjs

next.js