如何在下一个 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。

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

这个项目的代码是here

Answer 1

所以我解决了我没有从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 2

您可以检查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();
}