跳到主要内容

forbidden

forbidden 函数会抛出错误，并渲染 Next.js 403 错误页面。它对于处理应用中的授权错误很有用。你可以使用 forbidden.js file 自定义 UI。

¥The forbidden function throws an error that renders a Next.js 403 error page. It's useful for handling authorization errors in your application. You can customize the UI using the forbidden.js file.

要开始使用 forbidden，请在 next.config.js 文件中启用实验性的 authInterrupts 配置选项：

¥To start using forbidden, enable the experimental authInterrupts configuration option in your next.config.js file:

import type { NextConfig } from 'next'

const nextConfig: NextConfig = {
  experimental: {
    authInterrupts: true,
  },
}

export default nextConfig
module.exports = {
  experimental: {
    authInterrupts: true,
  },
}

forbidden 可以在 服务器组件、服务器操作 和 路由处理程序 中调用。

¥forbidden can be invoked in Server Components, Server Actions, and Route Handlers.

import { verifySession } from '@/app/lib/dal'
import { forbidden } from 'next/navigation'

export default async function AdminPage() {
  const session = await verifySession()

  // Check if the user has the 'admin' role
  if (session.role !== 'admin') {
    forbidden()
  }

  // Render the admin page for authorized users
  return <></>
}
import { verifySession } from '@/app/lib/dal'
import { forbidden } from 'next/navigation'

export default async function AdminPage() {
  const session = await verifySession()

  // Check if the user has the 'admin' role
  if (session.role !== 'admin') {
    forbidden()
  }

  // Render the admin page for authorized users
  return <></>
}

很高兴知道​

¥Good to know

  • forbidden 函数无法在 根布局 中调用。

    ¥The forbidden function cannot be called in the root layout.

示例​

¥Examples

基于角色的路由保护​

¥Role-based route protection

你可以使用 forbidden 根据用户角色限制对某些路由的访问。这可确保经过身份验证但缺乏所需权限的用户无法访问路由。

¥You can use forbidden to restrict access to certain routes based on user roles. This ensures that users who are authenticated but lack the required permissions cannot access the route.

import { verifySession } from '@/app/lib/dal'
import { forbidden } from 'next/navigation'

export default async function AdminPage() {
  const session = await verifySession()

  // Check if the user has the 'admin' role
  if (session.role !== 'admin') {
    forbidden()
  }

  // Render the admin page for authorized users
  return (
    <main>
      <h1>Admin Dashboard</h1>
      <p>Welcome, {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()

  // Check if the user has the 'admin' role
  if (session.role !== 'admin') {
    forbidden()
  }

  // Render the admin page for authorized users
  return (
    <main>
      <h1>Admin Dashboard</h1>
      <p>Welcome, {session.user.name}!</p>
    </main>
  )
}

使用服务器操作进行修改​

¥Mutations with Server Actions

在服务器操作中实现突变时，你可以使用 forbidden 仅允许具有特定角色的用户更新敏感数据。

¥When implementing mutations in Server Actions, you can use forbidden to only allow users with a specific role to update sensitive data.

'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()

  // Ensure only admins can update roles
  if (session.role !== 'admin') {
    forbidden()
  }

  // Perform the role update for authorized users
  // ...
}
'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()

  // Ensure only admins can update roles
  if (session.role !== 'admin') {
    forbidden()
  }

  // Perform the role update for authorized users
  // ...
}

版本历史​

¥Version History

版本变化
v15.1.0forbidden 推出。