Next.js + NextAuth.js认证异常：登录成功后重定向错误

核心问题原因 #

1. 中间件参数与回调写法错误：

   • middleware函数未接收req参数，导致代码中req.url未定义，触发运行时错误，中间件异常拦截已认证用户的请求，强制重定向到登录页并携带callbackUrl。
   • authorized回调参数格式错误，未正确解构包含token的对象，导致无法正确判断用户角色。

2. 缺少Session回调同步角色信息：
   使用JWT会话策略时，未配置session回调将JWT中的role字段同步到Session对象，可能导致中间件无法获取用户角色，进而触发权限拦截。

具体修复步骤 #

1. 修正中间件代码（middleware.js） #

import { withAuth } from "next-auth/middleware";
import { NextResponse } from "next/server"

export default withAuth(
  // 正确接收req参数
  function middleware(req) {
    // 已授权请求直接放行即可
    return NextResponse.next();
  },
  {
    callbacks: {
      // 正确解构参数对象中的token
      authorized({ token }) {
        return token?.role === 'admin';
      },
    },
  }
);

export const config = { matcher: ["/dashboard"] };

2. 补充NextAuth配置中的Session回调（app/api/auth/[...nextauth.js]） #

在callbacks对象中添加session回调，将JWT中的角色信息同步到Session：

callbacks: {
  jwt(params) {
    if (params.user?.role) {
      params.token.role = params.user.role;
    }
    return params.token;
  },
  // 新增session回调，同步角色信息
  session({ session, token }) {
    if (token?.role) {
      session.user.role = token.role;
    }
    return session;
  },
},

3. 优化登录页面判断逻辑（可选） #

为登录成功判断添加更严谨的条件，确保状态判断准确：

const isLoginSuccessful = response.ok && !response.error;

验证修复效果 #

1. 重启开发服务器，清除浏览器缓存与Cookie。
2. 使用正确凭证登录，此时应直接跳转到/dashboard页面，不会再出现带callbackUrl的登录页重定向。
3. 尝试直接访问/dashboard，未登录时会被重定向到登录页，登录后可正常访问。

内容的提问来源于stack exchange，提问作者Shabin-k