跳至內容
正在從 NextAuth.js v4 遷移?請閱讀 我們的遷移指南.

保護資源

一般來說,保護路由可以透過檢查工作階段,並且在找不到有效的工作階段時採取動作來完成,例如將使用者重新導向至登入頁面,或直接返回 401: 未經授權 的回應。

頁面

您可以使用從 NextAuth() 返回並從您的 auth.tsauth.js 組態檔案匯出的 auth 函式來取得工作階段物件。

app/server/page.tsx
import { auth } from "@/auth"
 
export default async function Page() {
  const session = await auth()
  if (!session) return <div>Not authenticated</div>
 
  return (
    <div>
      <pre>{JSON.stringify(session, null, 2)}</pre>
    </div>
  )
}

API 路由

在各種框架中保護 API 路由也可以使用 auth 匯出。

在 Next.js 中,您可以使用 auth 函式來包裹 API 路由處理常式。然後,請求參數上將會有一個 auth 金鑰,您可以用它來檢查有效的工作階段。

./app/api/admin/route.ts
import { auth } from "@/auth"
import { NextResponse } from "next/server"
 
export const GET = auth(function GET(req) {
  if (req.auth) return NextResponse.json(req.auth)
  return NextResponse.json({ message: "Not authenticated" }, { status: 401 })
})

Next.js 中介軟體

使用 Next.js 12+,保護一組頁面最簡單的方法是使用中介軟體檔案。您可以在根頁面目錄中建立一個 middleware.ts 檔案,其中包含以下內容。

middleware.ts
export { auth as middleware } from "@/auth"

然後在您的 auth.ts 檔案中定義 authorized 回呼。如需更多詳細資訊,請查看參考文件

auth.ts
import NextAuth from "next-auth"
 
export const { auth, handlers } = NextAuth({
  callbacks: {
    authorized: async ({ auth }) => {
      // Logged in users are authenticated, otherwise redirect to login page
      return !!auth
    },
  },
})

如果您想要在中介軟體內實作更多邏輯,您也可以使用 auth 方法作為包裝函式。

middleware.ts
import { auth } from "@/auth"
 
export default auth((req) => {
  if (!req.auth && req.nextUrl.pathname !== "/login") {
    const newUrl = new URL("/login", req.nextUrl.origin)
    return Response.redirect(newUrl)
  }
})

您也可以使用正規表示式來比對多個路由,或您可以否定某些路由,以便保護所有剩餘的路由。以下範例會避免在 favicon 或靜態影像等路徑上執行中介軟體。

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

中介軟體將會根據 matcher 組態匯出所定義的來保護頁面。如需有關比對器的更多詳細資訊,請查看Next.js 文件

💡

您不應該單獨依賴中介軟體來進行授權。請務必確保在盡可能靠近資料擷取的位置驗證工作階段。

Auth.js © Balázs Orbán 和團隊 -2024