NextJS 13 App Router已登录用户拦截登录/注册页问题

方案1：使用NextAuth中间件（最推荐，完全无延迟） #

中间件在请求到达页面之前就执行逻辑，能实现最即时的拦截，完全不会让用户看到登录/注册页内容。

在项目根目录创建middleware.ts文件，配置如下：

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

export default withAuth(
  function middleware(request: NextRequestWithAuth) {
    // 检测到已登录用户（存在token），直接重定向到首页
    if (request.nextauth.token) {
      return NextResponse.redirect(new URL("/", request.url))
    }
  },
  {
    callbacks: {
      // 返回true让中间件继续执行，我们自行处理重定向逻辑
      authorized: () => true,
    },
  }
)

// 指定需要拦截的路径
export const config = {
  matcher: ["/login", "/register"],
}

该配置会在用户请求/login或/register时，先检查登录状态，已登录则直接跳转到首页，完全跳过页面渲染。

方案2：服务端组件内即时重定向 #

如果不想用中间件，可在服务端组件层面直接处理——服务端组件在渲染前执行逻辑，不会有客户端延迟问题。

修改你的Login.tsx服务端组件：

import { getServerSession } from "next-auth/next"
import { authOptions } from "@/app/api/auth/[...nextauth]/route" // 确保路径与你的auth配置一致
import LoginForm from "./LoginForm"
import { redirect } from "next/navigation"

export default async function LoginPage() {
  const session = await getServerSession(authOptions)
  
  // 已登录直接重定向，服务端执行，页面不会渲染
  if (session) {
    redirect("/")
  }

  return <LoginForm />
}

若之前用getServerSession未生效，检查authOptions是否正确导入，确保它是你在[...nextauth]/route.ts中导出的配置对象。

方案3：客户端组件优化（备选，减少延迟感知） #

如果必须在客户端处理（比如依赖客户端状态的场景），可通过优化useSession的使用减少用户感知到的延迟：

"use client"

import { useSession } from "next-auth/react"
import { useEffect } from "react"
import { useRouter } from "next/navigation"

export default function LoginForm() {
  const { data: session, status } = useSession()
  const router = useRouter()

  useEffect(() => {
    if (status === "authenticated") {
      router.push("/")
    }
  }, [session, status, router])

  // 登录状态验证完成前，显示加载态，避免用户看到登录表单
  if (status === "loading") {
    return <div>Loading...</div>
  }

  // 未登录时渲染登录表单
  return (
    <form>
      {/* 你的登录表单内容 */}
    </form>
  )
}

该方案会在session加载完成前隐藏表单，减少用户看到登录页的机会，但仍不如前两种方案即时，因为需要等待客户端获取session数据。

内容的提问来源于stack exchange，提问作者Agus Dwi Milniadi