Next.js 15 + NextAuth 5 Beta认证异常：Token未写入Cookie

核心问题 #

基于Next.js 15 + NextAuth 5 Beta + MUI对接独立后端API实现认证时，登录请求后端成功返回Access Token，但Token未写入Cookie，同时触发错误。

可能原因及修复方案 #

1. NextAuth 5 Session配置缺失Cookie参数 #

NextAuth 5 Beta中，JWT会话策略需要显式配置Cookie规则，否则Token无法正确写入浏览器Cookie。

• 检查auth.config.ts或auth.ts的session配置，补充Cookie参数：

  export const authConfig = {
    session: {
      strategy: "jwt",
      cookie: {
        name: "next-auth.session-token",
        secure: process.env.NODE_ENV === "production",
        httpOnly: true,
        sameSite: "lax",
        path: "/",
      },
    },
    // 其他配置项
  } satisfies NextAuthConfig;
  

• 登录成功后需通过signIn方法让NextAuth处理Token存储：
  在login.action.ts中，获取后端Token后调用signIn：

  const res = await fetch(`${process.env.NEXT_PUBLIC_API_URL}/auth/login`, {
    method: "POST",
    body: JSON.stringify(credentials),
    headers: { "Content-Type": "application/json" },
  });
  
  const data = await res.json();
  if (res.ok && data.accessToken) {
    await signIn("credentials", {
      ...credentials,
      accessToken: data.accessToken,
      redirect: false,
    });
  }
  

2. Credentials Provider未正确返回Token数据 #

在auth.ts的Credentials Provider中，authorize函数必须返回包含Token的用户对象，才能让NextAuth将其存入JWT/Session：

providers: [
  Credentials({
    async authorize(credentials) {
      const res = await fetch(`${process.env.NEXT_PUBLIC_API_URL}/auth/login`, {
        method: "POST",
        body: JSON.stringify(credentials),
        headers: { "Content-Type": "application/json" },
      });
      const user = await res.json();
      if (res.ok && user.accessToken) {
        // 必须返回包含唯一标识id和Token的对象
        return { ...user, id: user.userId };
      }
      return null;
    },
  }),
],

同时补充JWT和Session回调，确保Token能同步到前端可用的Session中：

callbacks: {
  async jwt({ token, user }) {
    if (user) {
      token.accessToken = user.accessToken;
      token.id = user.id;
    }
    return token;
  },
  async session({ session, token }) {
    session.user.accessToken = token.accessToken;
    session.user.id = token.id;
    return session;
  },
},

3. Middleware拦截登录请求导致Cookie写入失败 #

检查middleware.ts的路径匹配规则，确保登录路径（/auth/login）不在保护范围内，避免未认证状态下的重定向打断Cookie写入流程：

export default auth((req) => {
  if (!req.nextUrl.pathname.startsWith("/auth") && !req.auth) {
    return NextResponse.redirect(new URL("/auth/login", req.url));
  }
});

export const config = {
  matcher: ["/((?!api|_next/static|_next/image|favicon.ico|auth).*)"],
};

4. 跨域场景下的Cookie配置问题 #

若前后端域名不同，需确保：

• 后端响应头设置Access-Control-Allow-Origin为前端域名，同时开启Access-Control-Allow-Credentials: true
• 前端登录请求携带credentials: "include"：

  const res = await fetch(`${process.env.NEXT_PUBLIC_API_URL}/auth/login`, {
    method: "POST",
    body: JSON.stringify(credentials),
    headers: { "Content-Type": "application/json" },
    credentials: "include",
  });
  

5. NextAuth 5 Beta版本兼容性问题 #

NextAuth 5仍处于Beta阶段，部分API可能存在不稳定情况：

• 执行npm update next-auth@beta更新到最新Beta版本
• 排查官方仓库已知Issues，确认是否存在同类问题

内容的提问来源于stack exchange，提问作者morteza mortezaie