unauthorized.js
未经授权的文件用于在身份验证期间调用 unauthorized
函数时渲染 UI。除了允许你自定义 UI 之外,Next.js 还将返回 401
状态代码。
¥The unauthorized file is used to render UI when the unauthorized
function is invoked during authentication. Along with allowing you to customize the UI, Next.js will return a 401
status code.
import Login from '@/app/components/Login'
export default function Unauthorized() {
return (
<main>
<h1>401 - Unauthorized</h1>
<p>Please log in to access this page.</p>
<Login />
</main>
)
}
import Login from '@/app/components/Login'
export default function Unauthorized() {
return (
<main>
<h1>401 - Unauthorized</h1>
<p>Please log in to access this page.</p>
<Login />
</main>
)
}
参考
¥Reference
属性
¥Props
unauthorized.js
组件不接受任何 props。
¥unauthorized.js
components do not accept any props.
示例
¥Examples
向未经身份验证的用户显示登录 UI
¥Displaying login UI to unauthenticated users
你可以使用 unauthorized
函数通过登录 UI 渲染 unauthorized.js
文件。
¥You can use unauthorized
function to render the unauthorized.js
file with a login UI.
import { verifySession } from '@/app/lib/dal'
import { unauthorized } from 'next/server'
export default async function DashboardPage() {
const session = await verifySession()
if (!session) {
unauthorized()
}
return <div>Dashboard</div>
}
import { verifySession } from '@/app/lib/dal'
import { unauthorized } from 'next/server'
export default async function DashboardPage() {
const session = await verifySession()
if (!session) {
unauthorized()
}
return <div>Dashboard</div>
}
import Login from '@/app/components/Login'
export default function UnauthorizedPage() {
return (
<main>
<h1>401 - Unauthorized</h1>
<p>Please log in to access this page.</p>
<Login />
</main>
)
}
import Login from '@/app/components/Login'
export default function UnauthorizedPage() {
return (
<main>
<h1>401 - Unauthorized</h1>
<p>Please log in to access this page.</p>
<Login />
</main>
)
}
版本历史
¥Version History
版本 | 变化 |
---|---|
v15.1.0 | unauthorized.js 推出。 |