Higher order component to handle both client and server side redirecting with Next.js
Note: this package is made for Next.js 2.0+
Example: with-universal-redirect.now.sh
npm install --save next-universal-redirect
Create a _error.js
file in the pages
directory of your project
pages/_error.js
:
import ErrorComponent from 'next/error'
import redirect from 'next-universal-redirect'
// This renders the default Next.js error/404 component
class Error extends React.Component {
static getInitialProps ({ req, res, xhr, pathname }) {
const statusCode = res ? res.statusCode : (xhr ? xhr.status : null)
return { statusCode }
}
render () {
return <ErrorComponent statusCode={this.props.statusCode} />
}
}
// Create a map of redirects
const list = new Map()
list.set('/example', '/example2')
// Calling `rewrite(list)(<ComponentHere />)` will return a HOC that will match the provided list against incoming page requests and will redirect accordingly.
export default redirect(list)(Error)