自定义应用程序 Next.js 13 后中间件无法工作

Question

我正在学习 Next.js - 版本 13，并尝试根据标准文档自定义 next.js 应用程序。但不知何故，中间件没有被调用。我想我在这里做错了什么。如果您有时间，请查看该问题。

这是 middleware.ts 的代码更改：

import { NextResponse } from "next/server";
import type { NextRequest } from "next/server";
import { AUTHORIZATION_TOKEN, COOKIE_TOKEN } from "@libs/constants";
import { verify } from "@libs/token";

export const config = {
  matcher: ["/admin/:path*", "/signin", "/api/:path*"],
};

export async function middleware(request: NextRequest) {
  const url = request.nextUrl.clone();
  const regex = new RegExp('\\/api\\/(category|product|cart|coupon|auth)\\/(create|update|delete)', 'i')

  let matcher: any = regex.exec(url.pathname);
  let token: any;
  let isValidToken: any;

  if (matcher && matcher[0]) {
    token = request.headers.get(AUTHORIZATION_TOKEN);
    isValidToken = await verify(token);
  } else {
    token = request.cookies.get(COOKIE_TOKEN)?.value;
    if (token) {
      isValidToken = await verify(JSON.parse(token));
    }

    if (url.pathname.startsWith("/admin")) {
      if (isValidToken) {
        return NextResponse.next();
      } else {
        url.pathname = "/signin";
        return NextResponse.redirect(url);
      }
    }
  
    if (url.pathname.startsWith("/signin") && isValidToken) {
      url.pathname = "/admin";
      return NextResponse.redirect(url);
    }
  }

  return NextResponse.next();
}

以及项目的结构：

在此输入图像描述

在这种情况下有人得到任何建议吗？如果我错了，请纠正我。太感谢了。

Answer 1

我有类似的问题。我已将middleware.ts文件移动到src如下文件夹中：/src/middleware.ts现在它被调用了。根据您的屏幕截图，您的 middleware.ts 似乎不在/src文件夹中。

另请记住，您不能执行 IO 操作，例如在该中间件函数中调用 DB。您仍然可以等待承诺或通过致电其他服务fetch。