路由守衛

透過配置 guardedPaths 和 guestPaths,框架自動注入全域路由守衛中介軟體,實現登入攔截和已登入重新導向。

配置

// nuxt.config.ts
swiftConfig: {
  auth: {
    // 需要登入才能存取的路徑(路徑前綴比對)
    guardedPaths: ['/mine', '/dashboard', '/settings'],

    // 已登入時不可存取的路徑(如登入頁、註冊頁)
    // 已登入使用者存取這些路徑會被重新導向到首頁
    guestPaths: ['/login', '/register'],
  }
}

守衛行為

路徑類型未登入存取已登入存取
guardedPaths 中的路徑重新導向到 /login?redirect=原路徑正常存取
guestPaths 中的路徑正常存取重新導向到 /(首頁)
其他路徑正常存取正常存取

路徑比對規則

使用前綴比對:guardedPaths: ['/mine'] 會比對 /mine、/mine/favorites、/mine/settings 等所有以 /mine 開頭的路徑。

登入成功後的重新導向

守衛將原始路徑存入查詢參數 ?redirect=,登入成功後,useLoginBy() 會自動讀取並跳轉到登入前的頁面。

自訂守衛邏輯

如需更複雜的守衛邏輯(如基於角色的權限控制),可在 app/middleware/ 中建立自訂中介軟體:

// app/middleware/auth.global.ts
export default defineNuxtRouteMiddleware(async (to) => {
  const userStore = useUserStore()

  // 自訂:管理員頁面需要 admin 角色
  if (to.path.startsWith('/admin')) {
    const loggedIn = await useLoginCheck()
    if (!loggedIn) return navigateTo('/login')
    if (!userStore.info?.isAdmin) return navigateTo('/')
  }
})

安全行為

framework 內建兩條 auth 相關的安全行為,無需額外設定即預設生效:

拒絕 URL 注入的渠道碼

systemStore.initCode()(由 framework 插件在初始化時調用)偵測到 ?switch=1 路徑下從 URL query 注入的渠道碼(?code=...)會被拒絕, 防止惡意分享連結劫持業務渠道歸因。僅站內合法路徑下的渠道碼切換會被接受。

logout 先撤銷伺服器端會話,再同步清理本地狀態

呼叫框架登出流程(userStore.logout())時,會先向後端 POST /login/logout 撤銷當前會話——失敗靜默吞掉、不阻斷登出(網路故障 / 後端未實作該端點時本地照清,零適配成本)——隨後同步清空:

  • 渠道碼 cookie(Set-Cookie: code=; Max-Age=0)
  • IDB 解密快取(如 useDecryptedAsset 快取的解密 blob URL)
  • 約定登入憑證 localStorage(防止登出後下個使用者登入時拿到上個使用者的憑證殘留)

避免登出殘留資訊洩漏到下個會話或下個使用者,同時保證原 token 在伺服器端立即失效——「使用者已登出」重新成為一道真實防線(對齊 OWASP 會話管理要求)。

延伸閱讀