forbidden
forbidden 函式會拋出錯誤並渲染 Next.js 的 403 錯誤頁面。這個函式在處理應用程式中的授權錯誤時非常有用。您可以使用 forbidden.js 檔案 來自訂 UI。
要開始使用 forbidden，請在 next.config.js 檔案中啟用實驗性的 authInterrupts 設定選項：
import type { NextConfig } from 'next'
const nextConfig: NextConfig = {
experimental: {
authInterrupts: true,
},
}
export default nextConfigmodule.exports = {
experimental: {
authInterrupts: true,
},
}forbidden 可以在伺服器元件 (Server Components)、伺服器動作 (Server Actions) 和路由處理程式 (Route Handlers) 中呼叫。
import { verifySession } from '@/app/lib/dal'
import { forbidden } from 'next/navigation'
export default async function AdminPage() {
const session = await verifySession()
// 檢查使用者是否具有 'admin' 角色
if (session.role !== 'admin') {
forbidden()
}
// 為授權使用者渲染管理頁面
return <></>
}import { verifySession } from '@/app/lib/dal'
import { forbidden } from 'next/navigation'
export default async function AdminPage() {
const session = await verifySession()
// 檢查使用者是否具有 'admin' 角色
if (session.role !== 'admin') {
forbidden()
}
// 為授權使用者渲染管理頁面
return <></>
}須知事項
forbidden函式不能在根佈局 (root layout) 中呼叫。
範例
基於角色的路由保護
您可以使用 forbidden 來根據使用者角色限制對特定路由的存取。這確保了已驗證但缺乏必要權限的使用者無法存取該路由。
import { verifySession } from '@/app/lib/dal'
import { forbidden } from 'next/navigation'
export default async function AdminPage() {
const session = await verifySession()
// 檢查使用者是否具有 'admin' 角色
if (session.role !== 'admin') {
forbidden()
}
// 為授權使用者渲染管理頁面
return (
<main>
<h1>管理儀表板</h1>
<p>歡迎, {session.user.name}!</p>
</main>
)
}import { verifySession } from '@/app/lib/dal'
import { forbidden } from 'next/navigation'
export default async function AdminPage() {
const session = await verifySession()
// 檢查使用者是否具有 'admin' 角色
if (session.role !== 'admin') {
forbidden()
}
// 為授權使用者渲染管理頁面
return (
<main>
<h1>管理儀表板</h1>
<p>歡迎, {session.user.name}!</p>
</main>
)
}使用伺服器動作進行變更
在實作伺服器動作中的變更時，您可以使用 forbidden 來僅允許具有特定角色的使用者更新敏感資料。
'use server'
import { verifySession } from '@/app/lib/dal'
import { forbidden } from 'next/navigation'
import db from '@/app/lib/db'
export async function updateRole(formData: FormData) {
const session = await verifySession()
// 確保只有管理員可以更新角色
if (session.role !== 'admin') {
forbidden()
}
// 為授權使用者執行角色更新
// ...
}'use server'
import { verifySession } from '@/app/lib/dal'
import { forbidden } from 'next/navigation'
import db from '@/app/lib/db'
export async function updateRole(formData) {
const session = await verifySession()
// 確保只有管理員可以更新角色
if (session.role !== 'admin') {
forbidden()
}
// 為授權使用者執行角色更新
// ...
}版本歷史
| 版本 | 變更內容 |
|---|---|
v15.1.0 | 首次引入 forbidden 函式 |