App使用新的NextJS 12.2中间件重定向受保护的路由时

Question

我正在更新我的下一个12.2.0。

我曾经有我的中间件嵌套在Pages/_middleware，但与这个较新的版本，这不再工作了。

我遵循升级指南

from this:

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)和所有这些错误在控制台:

Uncaught SyntaxError: Unexpected token '<' (atreact-refresh.js ts = 1656708611639:1:1) webpack.js ?ts = 1656708611639:1未捕获的SyntaxError:意外的令牌'<' (atwebpack.js ts = 1656708611639:1:1) main.js ?ts = 1656708611639:1未捕获SyntaxError:意外的token '<' (at main.js?ts=1656708611639:1:1)_app.js吗?ts=1656708611639:1 Uncaught SyntaxError: Unexpected token '<' (at _app.js?ts=1656708611639:1:1)ts = 1656708611639:1未捕获的SyntaxError:意外的令牌'<' (atcourses.js ? t = 1656708611639:1:1)_buildManifest.js吗?ts=1656708611639:1 Uncaught SyntaxError: Unexpected token '<' (at _buildManifest.js?ts=1656708611639:1:1)_ssgManifest.js吗?ts=1656708611639:1 Uncaught SyntaxError: Unexpected token '<' (at _ssgManifest.js?ts=1656708611639:1:1)

奇怪的是，当用户为auth时，第一个if语句重定向有效。

编辑2

如果我在文档中添加一个匹配器，它会工作:

// middleware.js
export function middleware(req) {
...
}
export const config = {
matcher: ['/login', '/'],
};

但是，我不能为每个受保护的路由添加匹配。这完全是小题大做。

Answer 1

这个以前有效吗?通过阅读逻辑，我觉得这似乎是一个无限循环:

• 如果用户在/login土地,他们会重定向到/
• 如果用户在其他地方登陆，他们会被重定向到/login

我知道有一些额外的条件来匹配这些重定向，但我认为在您的情况下，您正在匹配它们，以重定向的无休止循环结束:

1. 您有userToken，并尝试访问/login—>根据你的逻辑，它被重定向到/
2. 你有userToken，并尝试访问/(或任何其他URL真的)->根据你的逻辑，它被重定向到/login
3. 您有userToken，并尝试访问/login->这又是第1点!