nuxt-auth是如何通过cookie向后端校验用户登录状态的？

一、nuxt-auth 后端校验逻辑的实现位置 #

你看不到/api/user请求的核心原因是你用了SSR模式，校验逻辑分两端执行：

• 整页刷新场景：校验逻辑在Nuxt服务端的全局auth中间件内执行，/api/user请求是Nuxt服务端直接发往Laravel后端的，走服务端到服务端的通信，不会经过客户端浏览器，所以你在开发者工具的网络标签里看不到这条请求。
• 客户端路由切换场景：校验逻辑在客户端路由守卫内触发，此时/api/user请求才会从浏览器发出，你才能在网络标签里看到对应记录。
  核心校验逻辑源码位置（以@nuxtjs/auth-next版本为例）：在/runtime/core/auth.ts的fetchUser方法内，该方法会被服务端中间件、客户端路由守卫两个入口调用，存储模块只负责存登录态凭证和用户信息，不处理校验逻辑。

二、清空Redis/删除/api/user触发自动登出的原因 #

nuxt-auth默认的会话有效性校验逻辑就是请求/api/user接口，只要出现以下任意一种情况，就会自动判定登录失效，触发前端登出逻辑：

• 接口返回非2xx状态码
• 接口返回的用户数据为空
  你清空Redis后会话失效，/api/user会返回401；删除路由后接口返回404，都会命中失效判定规则。

三、复用现有机制实现验证码校验中间件 #

你不需要修改nuxt-auth源码，直接复用它自动携带Sanctum会话凭证的能力即可，不用你自己处理Cookie、请求头的传递逻辑，实现步骤如下：

1. 后端新增校验接口，比如/api/user/verify-captcha-status：校验当前会话对应的用户是否已经完成验证码验证，验证通过返回200，未通过返回403。
2. 新建Nuxt中间件，示例代码如下：

Nuxt3 写法 #

// middleware/captcha-required.ts
export default defineNuxtRouteMiddleware(async (to) => {
  // 只拦截受限区域路由
  if (!to.path.startsWith('/restricted')) return
  // 复用nuxt-auth的登录态判断，未登录直接跳登录页
  const { loggedIn } = useAuth()
  if (!loggedIn.value) return navigateTo('/login')
  
  // 调用验证码校验接口，nuxt-auth会自动带上当前会话的所有凭证
  const { status } = await useFetch('/api/user/verify-captcha-status')
  // 未通过校验跳转到验证码输入页
  if (status.value === 'error') return navigateTo('/captcha-input')
})

Nuxt2 写法 #

// middleware/captcha-required.js
export default async function ({ app, route, redirect }) {
  if (!route.path.startsWith('/restricted')) return
  // 复用nuxt-auth登录态判断
  if (!app.$auth.loggedIn) return redirect('/login')
  
  try {
    await app.$axios.$get('/api/user/verify-captcha-status')
  } catch (e) {
    if (e.response?.status === 403) {
      return redirect('/captcha-input')
    }
  }
}

该中间件和nuxt-auth的校验逻辑完全一致，SSR场景下会先在服务端执行，自动携带客户端传递的会话Cookie请求后端，客户端导航场景下会从浏览器自动带上凭证发请求，不需要你额外做适配。

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