重定向允许您将传入的请求路径重定向到不同的目标路径。
要使用重定向，您可以在 next.config.js 中使用 redirects 键：
module.exports = {
async redirects() {
return [
{
source: '/about',
destination: '/',
permanent: true,
},
]
},
}redirects 是一个异步函数，它期望返回一个数组，数组中包含具有 source、destination 和 permanent 属性的对象：
source 是传入的请求路径模式。destination 是您想要路由到的路径。permanent 为 true 或 false - 如果为 true，将使用 308 状态码，这指示客户端/搜索引擎永久缓存重定向；如果为 false，将使用 307 状态码，这是临时的，不会被缓存。为什么 Next.js 使用 307 和 308？ 传统上，302 用于临时重定向，301 用于永久重定向，但许多浏览器会将重定向的请求方法更改为
GET，无论原始方法是什么。例如，如果浏览器向POST /v1/users发出请求，并返回状态码302和位置/v2/users，则后续请求可能是GET /v2/users，而不是预期的POST /v2/users。Next.js 使用 307 临时重定向和 308 永久重定向状态码，以明确保留所使用的请求方法。
basePath: false 或 undefined - 如果为 false，匹配时将不包含 basePath，只能用于外部重定向。locale: false 或 undefined - 匹配时是否不包含语言环境。has 是一个 has 对象 数组，包含 type、key 和 value 属性。missing 是一个 missing 对象 数组，包含 type、key 和 value 属性。重定向在文件系统（包括页面和 /public 文件）之前进行检查。
当使用 Pages Router 时，除非 Proxy 存在并与路径匹配，否则重定向不适用于客户端路由（Link、router.push）。
当应用重定向时，请求中提供的任何查询值都将传递到重定向目标。例如，请参阅以下重定向配置：
{
source: '/old-blog/:path*',
destination: '/blog/:path*',
permanent: false
}须知：请记住在
source和destination路径的路径参数中，在冒号:前包含正斜杠/，否则路径将被视为字面字符串，您将面临导致无限重定向的风险。
当请求 /old-blog/post-1?hello=world 时，客户端将被重定向到 /blog/post-1?hello=world。
允许路径匹配，例如 /old-blog/:slug 将匹配 /old-blog/first-post（无嵌套路径）：
module.exports = {
async redirects() {
return [
{
source: '/old-blog/:slug',
destination: '/news/:slug', // Matched parameters can be used in the destination
permanent: true,
},
]
},
}模式 /old-blog/:slug 匹配 /old-blog/first-post 和 /old-blog/post-1，但不匹配 /old-blog/a/b（无嵌套路径）。模式锚定在开头：/old-blog/:slug 不会匹配 /archive/old-blog/first-post。
您可以在参数上使用修饰符：*（零个或多个），+（一个或多个），?（零个或一个）。例如，/blog/:slug* 匹配 /blog、/blog/a 和 /blog/a/b/c。
请阅读 path-to-regexp 文档了解更多详情。
要匹配通配符路径，您可以在参数后使用 *，例如 /blog/:slug* 将匹配 /blog/a/b/c/d/hello-world：
module.exports = {
async redirects() {
return [
{
source: '/blog/:slug*',
destination: '/news/:slug*', // Matched parameters can be used in the destination
permanent: true,
},
]
},
}要匹配正则表达式路径，您可以在参数后用括号括起正则表达式，例如 /post/:slug(\\d{1,}) 将匹配 /post/123 但不匹配 /post/abc：
module.exports = {
async redirects() {
return [
{
source: '/post/:slug(\\d{1,})',
destination: '/news/:slug', // Matched parameters can be used in the destination
permanent: false,
},
]
},
}以下字符 (, ), {, }, :, *, +, ? 用于正则表达式路径匹配，因此当在 source 中用作非特殊值时，必须通过在它们前面添加 \\ 进行转义：
module.exports = {
async redirects() {
return [
{
// this will match `/english(default)/something` being requested
source: '/english\\(default\\)/:slug',
destination: '/en-us/:slug',
permanent: false,
},
]
},
}要仅在头部、Cookie 或查询值与 has 字段匹配或与 missing 字段不匹配时才应用重定向，可以使用 has 字段或 missing 字段。source 和所有 has 项必须匹配，并且所有 missing 项必须不匹配，才能应用重定向。
has 和 missing 项可以包含以下字段：
type: String - 必须是 header、cookie、host 或 query 之一。key: String - 要匹配的所选类型中的键。value: String 或 undefined - 要检查的值，如果为 undefined，则任何值都将匹配。可以使用类似正则表达式的字符串来捕获值的特定部分，例如，如果 first-(?<paramName>.*) 的值用于 first-second，那么 second 将在目标中使用 :paramName。module.exports = {
async redirects() {
return [
// if the header `x-redirect-me` is present,
// this redirect will be applied
{
source: '/:path((?!another-page$).*)',
has: [
{
type: 'header',
key: 'x-redirect-me',
},
],
permanent: false,
destination: '/another-page',
},
// if the header `x-do-not-redirect` is present,
// this redirect will NOT be applied
{
source: '/:path((?!another-page$).*)',
missing: [
{
type: 'header',
key: 'x-do-not-redirect',
},
],
permanent: false,
destination: '/another-page',
},
// if the source, query, and cookie are matched,
// this redirect will be applied
{
source: '/specific/:path*',
has: [
{
type: 'query',
key: 'page',
// the page value will not be available in the
// destination since value is provided and doesn't
// use a named capture group e.g. (?<page>home)
value: 'home',
},
{
type: 'cookie',
key: 'authorized',
value: 'true',
},
],
permanent: false,
destination: '/another/:path*',
},
// if the header `x-authorized` is present and
// contains a matching value, this redirect will be applied
{
source: '/',
has: [
{
type: 'header',
key: 'x-authorized',
value: '(?<authorized>yes|true)',
},
],
permanent: false,
destination: '/home?authorized=:authorized',
},
// if the host is `example.com`,
// this redirect will be applied
{
source: '/:path((?!another-page$).*)',
has: [
{
type: 'host',
value: 'example.com',
},
],
permanent: false,
destination: '/another-page',
},
]
},
}basePath 的重定向当重定向利用 basePath 支持 时，每个 source 和 destination 都会自动带有 basePath 前缀，除非您在重定向中添加 basePath: false：
module.exports = {
basePath: '/docs',
async redirects() {
return [
{
source: '/with-basePath', // automatically becomes /docs/next.js/zh-cn/with-basePath
destination: '/another', // automatically becomes /docs/next.js/zh-cn/another
permanent: false,
},
{
// does not add /docs since basePath: false is set
source: '/without-basePath',
destination: 'https://example.com',
basePath: false,
permanent: false,
},
]
},
}在 App Router 中实现带有国际化的重定向时，您可以在 next.config.js 重定向中包含语言环境，但仅限于硬编码路径。
对于动态或按请求的语言环境处理，请使用 动态路由段和代理，它可以根据用户的首选语言进行重定向。
module.exports = {
async redirects() {
return [
{
// Manually handle locale prefixes for App Router
source: '/en/old-path',
destination: '/en/new-path',
permanent: false,
},
{
// Redirect for all locales using a parameter
source: '/:locale/old-path',
destination: '/:locale/new-path',
permanent: false,
},
{
// Redirect from one locale to another
source: '/de/old-path',
destination: '/en/new-path',
permanent: false,
},
{
// Catch-all redirect for multiple locales
source: '/:locale(en|fr|de)/:path*',
destination: '/:locale/new-section/:path*',
permanent: false,
},
]
},
}当重定向利用 i18n 支持 时，每个 source 和 destination 会自动添加前缀以处理配置的 locales，除非您在重定向中添加 locale: false。如果使用 locale: false，您必须为 source 和 destination 添加语言环境前缀，以使其正确匹配。
module.exports = {
i18n: {
locales: ['en', 'fr', 'de'],
defaultLocale: 'en',
},
async redirects() {
return [
{
source: '/with-locale', // automatically handles all locales
destination: '/another', // automatically passes the locale on
permanent: false,
},
{
// does not handle locales automatically since locale: false is set
source: '/nl/with-locale-manual',
destination: '/nl/another',
locale: false,
permanent: false,
},
{
// this matches '/' since `en` is the defaultLocale
source: '/en',
destination: '/en/another',
locale: false,
permanent: false,
},
// it's possible to match all locales even when locale: false is set
{
source: '/:locale/page',
destination: '/en/newpage',
permanent: false,
locale: false,
},
{
// this gets converted to /(en|fr|de)/(.*) so will not match the top-level
// `/` or `/fr` routes like /:path* would
source: '/(.*)',
destination: '/another',
permanent: false,
},
]
},
}在某些罕见情况下，您可能需要为旧版 HTTP 客户端分配自定义状态码以正确重定向。在这种情况下，您可以使用 statusCode 属性而不是 permanent 属性，但不能同时使用两者。为确保 IE11 兼容性，对于 308 状态码，会自动添加 Refresh 头部。
getStaticProps 和 getServerSideProps 中，您可以在请求时重定向特定页面。| 版本 | 更改 |
|---|---|
v13.3.0 | 添加了 missing。 |
v10.2.0 | 添加了 has。 |
v9.5.0 | 添加了 redirects。 |