使用新的NextJS 12.2中间件重定向路由时的应用

Question

我正在将我的旁边更新到12.2.0。

我以前将中间件嵌套在>页/_Middleware中，但是使用此较新版本，这不再起作用。

我正在关注升级指南

：

src/Pages/_middleware.js

export function middleware(req) {
  const userSession = req.headers.get('cookie');
  const url = req.nextUrl.clone();

  if (userSession?.includes('userToken')) {
    if (req.nextUrl.pathname === '/login') {
      url.pathname = '/';

      return NextResponse.redirect(url);
    }
    return NextResponse.next();
  }

  url.pathname = '/login';
  return NextResponse.rewrite(url);
}

从此

src/middleware.js

    import { NextResponse } from 'next/server';

 export function middleware(req) {
  const userSession = req.headers.get('cookie');
  const reqUrl = req.nextUrl.pathname;

  if (userSession?.includes('userToken')) {
    if (reqUrl.startsWith('/login')) {
      // this one works!
      return NextResponse.redirect(new URL('/', req.url));
    }
    return NextResponse.next();
  }

  if (reqUrl.startsWith('/login')) {
    return NextResponse.next();
  };

  const loginUrl = new URL('/login', req.url);

  return NextResponse.redirect(loginUrl);
};

开始 用户被重定向到/login他获得了一个空白页（没有下一个HTML），并且在控制台中所有这些错误：

untured syntaxerror：意外的令牌'＆lt;' （在 React-refresh.js？ts = 1656708611639：1：1）webpack.js？ts = 1656708611639：1 未接收的Syntaxerror：意外的令牌'＆lt;' （在 webpack.js？ts = 1656708611639：1：1）main.js？ts = 1656708611639：1未被教 SyntaxError：意外的令牌'＆lt;' （在main.js？ts = 1656708611639：1：1） } （在_app.js？ts = 1656708611639：1：1）courses.js？ts = 1656708611639：1 未接收的Syntaxerror：意外的令牌'＆lt;' （在 courses.js？ts = 1656708611639：1：1） _buildmanifest.js？ts = 1656708611639：1未熟悉的Syntaxerror：意外的令牌'＆lt;' （在_buildmanifest.js？ts = 1656708611639：1：1） _SSSGMANIFEST.JS？ts = 1656708611639：1未接收的Syntaxerror：意外的令牌'＆lt;' （在_ssgmanifest.js？ts = 1656708611639：1：1）

奇怪的是，如果用户为auth，则第一个语句重定向。

编辑2

如果我按照文档中的文档添加匹配器，则可以正常工作：

// middleware.js

export function middleware(req) {
...
}

export const config = {
  matcher: ['/login', '/'],
};

但是，我无法为每个受保护的路线添加匹配项。这是一个完整的过度杀伤力。

Answer 1

这以前工作吗？通过阅读逻辑，对我来说似乎是一个无尽的循环：

• 如果用户在/login中降落，他们将被重定向到/
• 如果用户降落在其他地方，则重定向到/login

我知道有一些额外的条件可以匹配这些重定向，但是在您的情况下，您正在与它们匹配，以无尽的重定向循环结束：

1. 您有USERTOKEN并尝试访问/login - ＆gt;通过您的逻辑，它将被重定向到/
2. 您具有usertoken，然后尝试访问/（或其他任何其他URL） - ＆gt;通过您的逻辑，它将被重定向到/login
3. 您具有usertoken，然后尝试访问/login - ＆gt;这再次是第1点！