How to redirect to an external URL in Next.js
In this post we will give you information about How to redirect to an external URL in Next.js. Hear we will give you detail about How to redirect to an external URL in Next.jsAnd how to use it also give you demo for it if it is necessary.
we are going to learn about how to redirect a user to an external URL in Next.js.
Redirects allow you to redirect an incoming request from the user (/about) to a different destination (https://google.com/about/).
Redirecting to an external URL
We can redirect to an external URL in Next.js by adding the following config to our next.config.jsfile.
Here is an example:
module.exports = { async redirects() { return [ { source: '/about', destination: 'https://google.com/about', permanent: false } ]; }};In the example above, if any user visits the /about page in our next.js app we are redirecting them to an external URL https://google.com/about.
We can add more redirects to the redirects() async function like this.
module.exports = { async redirects() { return [ { source: '/about', destination: 'https://google.com/about', permanent: true }, { source: '/contact', destination: 'https://twitter.com', permanent: true } ]; }};Note: To use redirects(), your next.js version should 9.5.0 or above.
Similarly, we can also redirect to an external URL using the window.location.href property inside the useEffect() hook.
Example:
import React, { Component, useEffect } from "react";function About() { useEffect(() => { window.location.href = "https://google.com/about"; }, []); return ( <div> <h1>This page is not available</h1> <p>You are redirecting to google.com/about</p> </div> );}export default About;Hope this code and post will helped you for implement How to redirect to an external URL in Next.js. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs