--- description: Add redirects to your Next.js app. --- # Redirects Redirects allow you to redirect an incoming request path to a different destination path. Redirects are only available on the Node.js environment and do not affect client-side routing. To use Redirects you can use the `redirects` key in `next.config.js`: ```js module.exports = { async redirects() { return [ { source: '/about', destination: '/', permanent: true, }, ] }, } ``` `redirects` is an async function that expects an array to be returned holding objects with `source`, `destination`, and `permanent` properties: - `source` is the incoming request path pattern. - `destination` is the path you want to route to. - `permanent` if the redirect is permanent or not. ## Path Matching Path matches are allowed, for example `/old-blog/:slug` will match `/old-blog/hello-world` (no nested paths): ```js module.exports = { async redirects() { return [ { source: '/old-blog/:slug', destination: '/news/:slug', // Matched parameters can be used in the destination permanent: true, }, ] }, } ``` ### Wildcard Path Matching To match a wildcard path you can use `*` after a parameter, for example `/blog/:slug*` will match `/blog/a/b/c/d/hello-world`: ```js module.exports = { async redirects() { return [ { source: '/blog/:slug*', destination: '/news/:slug*', // Matched parameters can be used in the destination permanent: true, }, ] }, } ``` ### Regex Path Matching To match a regex path you can wrap the regex in parenthesis after a parameter, for example `/blog/:slug(\\d{1,})` will match `/blog/123` but not `/blog/abc`: ```js module.exports = { async redirects() { return [ { source: '/old-blog/:post(\\d{1,})', destination: '/blog/:post', // Matched parameters can be used in the destination permanent: false, }, ] }, } ``` ### Redirects with basePath support When leveraging [`basePath` support](/docs/api-reference/next.config.js/basepath.md) with redirects each `source` and `destination` is automatically prefixed with the `basePath` unless you add `basePath: false` to the redirect: ```js module.exports = { basePath: '/docs', async redirects() { return [ { source: '/with-basePath', // automatically becomes /docs/with-basePath destination: '/another', // automatically becomes /docs/another permanent: false, }, { // does not add /docs since basePath: false is set source: '/without-basePath', destination: '/another', basePath: false, permanent: false, }, ] }, } ``` In some rare cases, you might need to assign a custom status code for older HTTP Clients to properly redirect. In these cases, you can use the `statusCode` property instead of the `permanent` property, but not both. Note: to ensure IE11 compatibility a `Refresh` header is automatically added for the 308 status code.