next.js 从url获取查询时出现下一个js中间件错误

cclgggtu 于 2022-11-23 发布在其他

关注(0)|答案(1)|浏览(215)

我尝试从我的站点中的一个路由的url中获取令牌，但是中间件记录了3次令牌，第二次令牌为空，而我记录了请求url，我的url是http：//localhost：3000/auth/newPassword，但是第二次呈现的是http：//localhost：3000/_next/static/chunks/pages/auth/newPassword.js？ts=1667894719054有人知道这里的问题是什么吗？
我向用户发送了一封电子邮件，要求输入新密码，电子邮件的URL中带有查询令牌。我希望中间件在访问新密码路由之前检查令牌是否有效，然后在那里验证令牌，但在第二次时，令牌对我呈现为空，这使我的项目崩溃

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

const secret = process.env.JWT_SECRET!;

export default async function middleware(req: NextRequest) {
  const url = req.url;
  const token = await req.nextUrl.searchParams.get("token")!;
  const cookies = req.cookies;
  if (url.includes("/auth/newPassword")) {
    console.log(url);

    if (token === undefined) {
      return NextResponse.redirect("http://localhost:3000/auth/signin");
    }
    try {
      verify(token, secret);
      return NextResponse.next();
    } catch (e) {
      return NextResponse.redirect("http://localhost:3000/auth/signin");
    }
  }
}

next.js

来源：https://stackoverflow.com/questions/74357550/next-js-middleware-error-on-getting-the-query-from-the-url

1条答案

按热度按时间

gjmwrych1#

这是因为当你加载http://localhost:3000/auth/newPassword时，下一步会向http://localhost:3000/_next/static/chunks/pages/auth/newPassword.js?ts=1667894719054发出请求（我猜是为了水合），这个文件基本上只包含与javascript相关的内容，你不会认为你的中间件会匹配这个路由，而目前它是（因为它包含auth/newPassword）。
我建议使用带有否定匹配器的中间件：

export const config = {
  matcher: [
    /*
     * Match all paths except for:
     * 1. /api routes
     * 2. /_next (Next.js internals)
     * 3. /fonts (inside /public)
     * 4. /examples (inside /public)
     * 5. all root files inside /public (e.g. /favicon.ico)
     */
    '/((?!api|_next|fonts|500|examples|[\\w-]+\\.\\w+).*)',
  ],
};

export default function middleware(req: NextRequest) {
  const url = req.url;
  const token = await req.nextUrl.searchParams.get("token")!;
  const cookies = req.cookies;
  if (url.includes("/auth/newPassword")) {
    console.log(url);

    if (token === undefined) {
      return NextResponse.redirect("http://localhost:3000/auth/signin");
    }
    try {
      verify(token, secret);
      return NextResponse.next();
    } catch (e) {
      return NextResponse.redirect("http://localhost:3000/auth/signin");
    }
   }
}

赞(0）回复(0）举报 2022-11-23

我来回答

next.js 从url获取查询时出现下一个js中间件错误

1条答案

相关问题

热门标签

最新问答