nuxt-auth

用途

nuxt-auth 用于在 Nuxt 应用中实现认证与授权，后端认证方案为 Laravel Sanctum，授权方式为基于权限的访问控制。它适合需要登录/登出、保护页面、按权限显示或隐藏操作入口的前后端分离项目。

主要能力

• Laravel Sanctum 认证集成：通过 nuxt-auth-sanctum 模块接入后端认证接口。
• 认证状态管理：提供 useSanctumAuth 组合式函数，暴露 user、isAuthenticated、login、logout、init。
• 权限判断：提供 usePermissions 组合式函数，暴露 can 与 cannot，用于单条权限判断。
• 页面保护：通过 definePageMeta 声明页面所需权限。
• 模板级控制：可在模板中结合 can 判断条件渲染按钮等元素。

使用方式

模块配置

在 nuxt.config.ts 中注册模块并配置 Sanctum：

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['nuxt-auth-sanctum'],

  sanctum: {
    baseUrl: process.env.NUXT_PUBLIC_API_URL,
    endpoints: {
      login: '/auth/login',
      user: '/auth/user',
      csrf: '/sanctum/csrf-cookie',
      logout: '/auth/logout',
    },
    redirect: {
      onAuthOnly: '/auth/login',
      onGuestOnly: '/',
    },
  },
})

认证组合式函数

const { user, isAuthenticated, login, logout, init } = useSanctumAuth()

// Login
await login({ email, password })

// Logout
await logout()

// Check auth
if (isAuthenticated.value) { /* ... */ }

权限检查

const { can, cannot } = usePermissions()

// Single permission
if (can('leads.create')) { /* ... */ }

在模板中使用：

<UButton v-if="can('leads.create')" @click="createLead">Create</UButton>

页面保护

definePageMeta({
  permissions: 'leads.list',
})

适用场景

• Nuxt 前端对接 Laravel Sanctum 后端，需要统一处理登录、登出与用户信息获取。
• 需要按权限控制页面访问，例如仅允许具备 leads.list 权限的用户进入列表页。
• 需要按权限控制界面元素，例如仅对具备 leads.create 权限的用户显示创建按钮。

限制

资料中未提供关于收费、价格、支持平台、性能效果或完整安装命令的说明，这些内容暂未提供。