跳到主要内容

redirect

该 redirect() 允许你将用户重定向到另一个 URL。 redirect 可以在服务器组件、路由处理程序和服务器操作中使用。

example

app/team/[id]/page.js
import { redirect } from 'next/navigation'
 
async function fetchTeam(id) {
    const res = await fetch('https://...')
    if (!res.ok) return undefined
    return res.json()
}

export default async function Profile({ params }) {
    const team = await fetchTeam(params.id)
    if (!team) {
        redirect('/login')
    }

    // ...
}

重定向状态码

先来帮助大家复习一下常见的重定向状态码：

301：表示请求的资源已永久移动到新位置。
302：表示请求的资源临时移动到新位置。
307：与302类似，表示请求的资源临时移动到新位置。
308：与301类似，表示请求的资源永久移动到新位置。

我们发现301和307，302和308很相似，但是也存在一些本质的差别，这也是面试中经常会被问到的问题：

许多浏览器在使用 301、302 时会将将重定向的请求方法从 POST 更改为 GET，而不管源请求方法如何, 最严重的是 POST 的body会丢失。而 307 和 308 不会改变请求的方法，请求是POST, 重定向后还是POST。

而在 next.js 中的redirect()方法默认采用的是307临时重定向

permanentRedirect

如果你想使用308永久重定向，你可以使用 permanentRedirect() 方法。具体的使用方法和 redirect() 一样。

example
重定向状态码
permanentRedirect