Next.js: Difference between router.replace and router.refresh?

Viewed 645

for some cookie issues, I need to refresh next.js page to execute getServerSideProps after redirecting into my Home page. I tried using router from 'next/router', but only router.reload() seemed calling getServerSideProps once more entirely, on the other hand, router.replace not.

export default function Home(props) {
  const router = useRouter()

  const refreshServerSide = () => {
    router.replace(router.asPath) // <--- it doen'st call getServerSideProps again
    // router.reload();  // <--- it works!
  }


//...
export async function getServerSideProps(ctx) {
  const keycloak: any = Keycloak(ctx.req); 
  
let user = {} as user;
  const instance = axios.create({
    baseURL: 'http://localhost:8081',
    headers: { 'Authorization': 'Bearer ' + keycloak.token }
  });

  await instance.get('/auth/realms/demo/protocol/openid-connect/userinfo')
    .then(response => {
      user = response.data;
    }).catch(err => {
      // console.log(err)
    })
    return { props: 
    { urqlState: ssrCache.extractData() ,
    user: user}
  };
}



I searched through google about how to refresh or reload getServerSideProps, they suggests router.replace. Is there any difference that I don't know?

0 Answers
Related