下一个中间件组合 - next-auth 和 next-international

Question

我正在尝试为下一个 Js 14 应用程序创建一个组合中间件。就我而言，我想为应用程序中的每个路线运行本地化中间件。另外，我需要为某些特定路由启用授权路由。但不幸的是，我没能成功。成功登录后重定向到管理路由时，它在本地化中间件中给我一个错误。

使用的软件包和版本

"下一个国际": "^1.2.3", “下一个验证”：“^4.24.5”，

这是我在 middleware.ts 中的代码

import { NextRequest, NextResponse, NextFetchEvent } from 'next/server';
import { NextRequestWithAuth, withAuth } from 'next-auth/middleware';

const I18nMiddleware = createI18nMiddleware({
  locales: ['en', 'sn'],
  defaultLocale: 'en',
  urlMappingStrategy: 'rewrite',
});

const nextAuthMiddleware = withAuth({
  pages: {
    signIn: '/login',
  },
});

export function middleware(
  request: NextRequest,
  requestAuth: NextRequestWithAuth,
  event: NextFetchEvent,
) {
  
  const nextAuthResponse = nextAuthMiddleware(request, event);

  if (request.nextUrl.pathname.startsWith('/admin')) {
    if (nextAuthResponse) {
      return nextAuthResponse;
    }
  }
  if (request.nextUrl.pathname.startsWith('/')) {
    return I18nMiddleware(request);
  }
  return NextResponse.next();
}

export const config = {
  matcher: [
    '/((?!api|static|.*\\..*|_next|favicon.ico|robots.txt).*)',
    '/',
    '/admin/:path*',
  ],
};```

Answer 1

看起来您组合两个中间件功能的方式可能存在问题。您应该将身份验证检查集成到本地化中间件中，而不是尝试同时使用 nextAuthMiddleware 和 I18nMiddleware。

以下是修改中间件的方法：

import { NextRequest, NextResponse, NextFetchEvent } from 'next/server';
import { withAuth } from 'next-auth/middleware';
import { createI18nMiddleware } from 'next-international/middleware';

const I18nMiddleware = createI18nMiddleware({
  locales: ['en', 'sn'],
  defaultLocale: 'en',
  urlMappingStrategy: 'rewrite',
});

const nextAuthMiddleware = withAuth({
  pages: {
    signIn: '/login',
  },
});

export async function middleware(request: NextRequest, event: NextFetchEvent) {
  // Check if the path starts with '/admin'
  if (request.nextUrl.pathname.startsWith('/admin')) {
    const authResponse = await nextAuthMiddleware(request, event);

    // Redirect to login page if user is not authenticated
    if (authResponse) {
      return authResponse;
    }
  }

  // Run localization middleware for all routes
  return I18nMiddleware(request);
}

export const config = {
  matcher: [
    '/((?!api|static|.*\\..*|_next|favicon.ico|robots.txt).*)',
    '/',
    '/admin/:path*',
  ],
};

在此代码中，仅针对以“/admin”开头的路由调用身份验证中间件，并且本地化中间件应用于所有路由。